myrta-ui 17.0.26 → 17.0.27
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.
- package/esm2022/lib/components/form/input-select/input-select.component.mjs +7 -4
- package/esm2022/lib/components/paginator/paginator.component.mjs +6 -3
- package/esm2022/lib/components/pdf-viewer/pdf-viewer.component.mjs +2 -2
- package/esm2022/lib/components/table/table.component.mjs +2 -2
- package/fesm2022/myrta-ui.mjs +13 -7
- package/fesm2022/myrta-ui.mjs.map +1 -1
- package/lib/components/form/input-select/input-select.component.d.ts +3 -1
- package/lib/components/paginator/paginator.component.d.ts +3 -1
- package/package.json +1 -1
package/fesm2022/myrta-ui.mjs
CHANGED
|
@@ -2230,6 +2230,7 @@ class InputSelectComponent {
|
|
|
2230
2230
|
notFoundText = 'Не найдено';
|
|
2231
2231
|
closeOnSelect = true;
|
|
2232
2232
|
multiCollapseCount = null;
|
|
2233
|
+
dropdownPosition = 'auto';
|
|
2233
2234
|
// ERROR
|
|
2234
2235
|
invalid = false;
|
|
2235
2236
|
invalidMessage = '';
|
|
@@ -2313,13 +2314,13 @@ class InputSelectComponent {
|
|
|
2313
2314
|
this.searched.emit({ term: event.term, items: event.items });
|
|
2314
2315
|
}
|
|
2315
2316
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2316
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: InputSelectComponent, selector: "mrx-input-select", inputs: { fields: "fields", size: "size", selected: "selected", bindValue: "bindValue", bindLabel: "bindLabel", customClasses: "customClasses", wrapperCustomClasses: "wrapperCustomClasses", multiple: "multiple", loading: "loading", addTag: "addTag", clearable: "clearable", items: "items", groupBy: "groupBy", emptyValue: "emptyValue", virtualScroll: "virtualScroll", trackByFn: "trackByFn", displayValue: "displayValue", disabledFromDisplay: "disabledFromDisplay", maxLength: "maxLength", customSearchFn: "customSearchFn", isBottomLabel: "isBottomLabel", search: "search", required: "required", disabled: "disabled", readonly: "readonly", showEmptyFields: "showEmptyFields", placeholder: "placeholder", searchable: "searchable", loadLabel: "loadLabel", notFoundText: "notFoundText", closeOnSelect: "closeOnSelect", multiCollapseCount: "multiCollapseCount", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid", label: "label", labelRequiredHidden: "labelRequiredHidden", labelExtraClass: "labelExtraClass", tooltip: "tooltip", tooltipHidden: "tooltipHidden", tooltipVisible: "tooltipVisible", setMaxSelectedItems: ["maxSelectedItems", "setMaxSelectedItems"] }, outputs: { changed: "changed", modelChange: "modelChange", searched: "searched" }, providers: [
|
|
2317
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: InputSelectComponent, selector: "mrx-input-select", inputs: { fields: "fields", size: "size", selected: "selected", bindValue: "bindValue", bindLabel: "bindLabel", customClasses: "customClasses", wrapperCustomClasses: "wrapperCustomClasses", multiple: "multiple", loading: "loading", addTag: "addTag", clearable: "clearable", items: "items", groupBy: "groupBy", emptyValue: "emptyValue", virtualScroll: "virtualScroll", trackByFn: "trackByFn", displayValue: "displayValue", disabledFromDisplay: "disabledFromDisplay", maxLength: "maxLength", customSearchFn: "customSearchFn", isBottomLabel: "isBottomLabel", search: "search", required: "required", disabled: "disabled", readonly: "readonly", showEmptyFields: "showEmptyFields", placeholder: "placeholder", searchable: "searchable", loadLabel: "loadLabel", notFoundText: "notFoundText", closeOnSelect: "closeOnSelect", multiCollapseCount: "multiCollapseCount", dropdownPosition: "dropdownPosition", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid", label: "label", labelRequiredHidden: "labelRequiredHidden", labelExtraClass: "labelExtraClass", tooltip: "tooltip", tooltipHidden: "tooltipHidden", tooltipVisible: "tooltipVisible", setMaxSelectedItems: ["maxSelectedItems", "setMaxSelectedItems"] }, outputs: { changed: "changed", modelChange: "modelChange", searched: "searched" }, providers: [
|
|
2317
2318
|
{
|
|
2318
2319
|
provide: NG_VALUE_ACCESSOR,
|
|
2319
2320
|
useExisting: forwardRef(() => InputSelectComponent),
|
|
2320
2321
|
multi: true,
|
|
2321
2322
|
},
|
|
2322
|
-
], queries: [{ propertyName: "selectOptionsTemplate", first: true, predicate: ["selectOptionsTemplate"], descendants: true }, { propertyName: "labelTemplate", first: true, predicate: ["labelTemplate"], descendants: true }, { propertyName: "tagTemplate", first: true, predicate: ["tagTemplate"], descendants: true }, { propertyName: "multiLabelTemplate", first: true, predicate: ["multiLabelTemplate"], descendants: true }], ngImport: i0, template: "<div class=\"mrx-input-select\" [class.mrx-input-error]=\"invalid\" [class]=\"wrapperCustomClasses\">\r\n <div [class.inputbox-error]=\"showEmptyFields && required && !isVerified\"\r\n [class.inputbox-success]=\"showEmptyFields && required && isVerified\">\r\n\r\n <ng-select\r\n [items]=\"items\"\r\n [ngModel]=\"value\"\r\n [addTag]=\"addTag\"\r\n [bindValue]=\"bindValue\"\r\n [bindLabel]=\"bindLabel\"\r\n [multiple]=\"multiple\"\r\n [maxSelectedItems]=\"maxSelectedItems\"\r\n [groupBy]=\"groupBy ? groupBy : ''\"\r\n [placeholder]=\"placeholder\"\r\n [trackByFn]=\"trackByFn\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [loading]=\"loading\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [clearable]=\"clearable\"\r\n [class]=\"getClasses\"\r\n [searchable]=\"searchable\"\r\n [closeOnSelect]=\"closeOnSelect\"\r\n [searchFn]=\"customSearchFn\"\r\n [notFoundText]=\"notFoundText\"\r\n [maxlength]=\"maxLength.toString() || 'none'\"\r\n clearAllText=\"\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C\"\r\n addTagText=\"\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C\"\r\n loadingText=\"\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430...\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n (search)=\"updateSearch($event)\"\r\n >\r\n <ng-template ng-label-tmp let-item=\"item\" *ngIf=\"disabled && disabledFromDisplay\">\r\n {{ displayValue }}\r\n </ng-template>\r\n <ng-template ng-option-tmp let-item=\"item\" let-clear=\"clear\" *ngIf=\"selectOptionsTemplate\">\r\n <ng-container *ngTemplateOutlet=\"selectOptionsTemplate; context:{item: item, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\" *ngIf=\"labelTemplate\">\r\n <ng-container *ngTemplateOutlet=\"labelTemplate; context:{item: item, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-tag-tmp let-items=\"items\" *ngIf=\"tagTemplate\">\r\n <ng-container *ngTemplateOutlet=\"tagTemplate; context:{items: items}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-loadingtext-tmp>\r\n <div class=\"ng-option disabled\">{{ loadLabel || '\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430' }}</div>\r\n </ng-template>\r\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\" *ngIf=\"multiLabelTemplate\">\r\n <ng-container *ngTemplateOutlet=\"multiLabelTemplate; context:{items: items, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\" *ngIf=\"multiCollapseCount\">\r\n <ng-container *ngIf=\"value.length < multiCollapseCount\">\r\n <div class=\"ng-value\" *ngFor=\"let item of items\">\r\n <span class=\"ng-value-label\">{{ item['label'] }}</span>\r\n <span class=\"ng-value-icon right\" (click)=\"clear(item)\">\u00D7</span>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"value.length >= multiCollapseCount\" class=\"ng-summary-list\">\r\n <div class=\"ng-value ng-value-empty\">\r\n <span class=\"ng-value-label\">\u0412\u044B\u0431\u0440\u0430\u043D\u043E: {{ value.length }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template ng-loadingspinner-tmp>\r\n <mrx-loader\r\n [ngStyle]=\"{display: 'flex'}\"\r\n [color]=\"'brand'\" size=\"small\"\r\n customClasses=\"align-self-center mr-2\"\r\n ></mrx-loader>\r\n </ng-template>\r\n </ng-select>\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 [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [":host::ng-deep .mrx-input-select{position:relative}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container{background-color:var(--neutral-bg-disabled)}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container:hover:before{border-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container .ng-arrow-wrapper .ng-arrow:after{color:var(--neutral-icon-disabled)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container{align-items:flex-start;padding:var(--spacing-2);padding-right:var(--spacing-3);box-sizing:border-box;border:none!important;border-radius:var(--border-radius-1)!important;width:100%;height:auto;outline:none;transition:outline-width .2s,border .2s;z-index:1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:before{content:\"\";position:absolute;left:0;top:0;width:100%;height:100%;border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);transition:.2s;z-index:-1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container.ng-has-value .ng-placeholder{display:none}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:focus,:host::ng-deep .mrx-input-select .ng-select .ng-select-container:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)!important}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:hover:before{border-color:var(--neutral-bg-stroke-hover)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container{display:flex;align-items:center;position:relative;padding:var(--spacing-1) var(--spacing-2)!important;min-height:var(--sizing-8)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-placeholder{top:revert!important;color:var(--neutral-text-tertiary)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value{display:flex;align-items:center;white-space:nowrap}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-label{overflow:hidden;font-size:var(--body-md-font-size);line-height:var(--body-md-line-height)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{color:transparent}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-input{display:flex;align-items:center;height:auto;padding-left:var(--spacing-2)!important;z-index:-1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-input>input{position:relative;z-index:-1;padding:0;transform:none;padding-right:var(--spacing-2)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .mrx-loader{transform:translateY(4px)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper{display:flex;align-items:center;justify-content:center;padding:0;transform:translateY(4px)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-arrow{font-size:0;position:relative;width:100%!important;height:100%!important;background-image:none;line-height:normal;border-radius:var(--border-radius-1)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-arrow:after{content:\"\";position:absolute;inset:0;width:100%;height:100%;font-family:mrx-icon-font;font-size:var(--body-extra-lg-font-size);color:var(--neutral-icon-default)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:hover .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:hover .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:focus .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:focus .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:hover .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:hover .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:focus .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:focus .ng-arrow{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper{margin-right:var(--spacing-2)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear:after{content:\"\\e92b\"}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:after{content:\"\\e923\"}:host::ng-deep .mrx-input-select .ng-select.ng-select-opened .ng-select-container{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-opened .ng-arrow-wrapper .ng-arrow{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable .ng-has-value .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container.ng-has-value .ng-value-container{max-width:calc(100% - 88px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.mrx-input-loading .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple .ng-value-container{max-width:calc(100% - var(--sizing-6))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple .ng-value-container .ng-value{min-height:var(--sizing-8)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container{min-height:var(--sizing-12)!important}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container .ng-clear-wrapper,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container .ng-arrow-wrapper{width:var(--sizing-6)!important;min-width:var(--sizing-6);height:var(--sizing-6);min-height:var(--sizing-6)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable .ng-has-value .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container.ng-has-value .ng-value-container{max-width:calc(100% - 64px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.mrx-input-loading .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container{min-height:var(--sizing-10)!important}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container{padding:0 var(--spacing-2) 0 var(--spacing-2)!important;min-height:var(--sizing-6);max-width:calc(100% - var(--sizing-4))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container .ng-value{margin-bottom:0;min-height:var(--sizing-6)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .mrx-loader{width:var(--sizing-4);height:var(--sizing-4)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper{width:var(--sizing-4)!important;min-width:var(--sizing-4);height:var(--sizing-4);min-height:var(--sizing-4)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper .ng-arrow:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper .ng-arrow:after{font-size:var(--body-lg-font-size)}:host::ng-deep .mrx-input-select .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value .ng-value-label{text-overflow:ellipsis!important;overflow:hidden;max-width:100%!important;display:block;white-space:nowrap}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container.ng-has-value .ng-value-container{gap:var(--spacing-2);padding:0!important;padding-right:var(--spacing-2)!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{display:flex;flex-direction:row;width:100%;max-width:max-content;margin:0;background:var(--brand-bg-secondary-default);border-radius:var(--border-radius-1);padding:0;padding-left:var(--spacing-2);padding-right:var(--spacing-1)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-empty{padding-right:var(--spacing-3)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{color:var(--neutral-text-primary);padding-right:var(--spacing-1);text-overflow:ellipsis!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{position:relative;min-width:var(--sizing-4);min-height:var(--sizing-4);order:1}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:after{content:\"\\e92b\";position:absolute;left:0;top:0;width:100%;height:100%;font-family:mrx-icon-font;font-size:var(--body-lg-font-size);color:var(--neutral-icon-default)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input>input{font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);transform:none!important}:host::ng-deep .mrx-input-select .ng-dropdown-panel{z-index:900;background:var(--brand-bg-tertiary-default);box-shadow:0 4px 10px #3a3a3a26;border-radius:var(--border-radius-1);margin-top:var(--spacing-1);border:none}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items{border-radius:var(--border-radius-1)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar{width:8px;background-color:transparent}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-track{border-radius:var(--border-radius-2);background-color:transparent}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-thumb{border-radius:var(--border-radius-2);background-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{min-height:var(--sizing-10);transition:.2s;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-4);white-space:normal}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:var(--spacing-6)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option span{display:flex;align-items:center;font-size:var(--body-md-font-size);line-height:var(--body-md-line-height)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background:var(--brand-bg-tertiary-default);color:var(--neutral-text-primary)!important}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background:var(--brand-bg-tertiary-default);position:relative;padding-right:40px;color:var(--neutral-text-primary)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-label{font-weight:400}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected:before{content:url(\"data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3336 4.6665L6.00032 11.9998L2.66699 8.66649' stroke='%23000' stroke-width='0.999998' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");position:absolute;top:50%;transform:translateY(-50%);right:16px;line-height:0}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option:hover{background:var(--brand-bg-secondary-default)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{min-height:var(--sizing-10);transition:.2s;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-4);white-space:normal;color:var(--neutral-text-tertiary);font-weight:700}:host::ng-deep .mrx-input-select.mrx-input-error{display:block}:host::ng-deep .mrx-input-select.mrx-input-error .ng-select .ng-select-container:before{border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-error.ng-select .ng-select-container{background-color:var(--system-bg-negative-secondary)}:host::ng-deep .mrx-input-select .mrx-input-checked-error.ng-select .ng-select-container:hover{border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container{background-color:var(--system-bg-positive-secondary)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container:before{border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}:host::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-summary-list .ng-value{max-width:100%!important}:host::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-summary-list .ng-value .ng-value-label{text-overflow:initial!important;overflow:initial}\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: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }, { kind: "component", type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { kind: "component", type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { kind: "component", type: i6.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i6.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i6.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i6.NgMultiLabelTemplateDirective, selector: "[ng-multi-label-tmp]" }, { kind: "directive", type: i6.NgLoadingTextTemplateDirective, selector: "[ng-loadingtext-tmp]" }, { kind: "directive", type: i6.NgTagTemplateDirective, selector: "[ng-tag-tmp]" }, { kind: "directive", type: i6.NgLoadingSpinnerTemplateDirective, selector: "[ng-loadingspinner-tmp]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2323
|
+
], queries: [{ propertyName: "selectOptionsTemplate", first: true, predicate: ["selectOptionsTemplate"], descendants: true }, { propertyName: "labelTemplate", first: true, predicate: ["labelTemplate"], descendants: true }, { propertyName: "tagTemplate", first: true, predicate: ["tagTemplate"], descendants: true }, { propertyName: "multiLabelTemplate", first: true, predicate: ["multiLabelTemplate"], descendants: true }], ngImport: i0, template: "<div class=\"mrx-input-select\" [class.mrx-input-error]=\"invalid\" [class]=\"wrapperCustomClasses\">\r\n <div [class.inputbox-error]=\"showEmptyFields && required && !isVerified\"\r\n [class.inputbox-success]=\"showEmptyFields && required && isVerified\">\r\n\r\n <ng-select\r\n [items]=\"items\"\r\n [ngModel]=\"value\"\r\n [addTag]=\"addTag\"\r\n [bindValue]=\"bindValue\"\r\n [bindLabel]=\"bindLabel\"\r\n [multiple]=\"multiple\"\r\n [maxSelectedItems]=\"maxSelectedItems\"\r\n [groupBy]=\"groupBy ? groupBy : ''\"\r\n [placeholder]=\"placeholder\"\r\n [trackByFn]=\"trackByFn\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [loading]=\"loading\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [clearable]=\"clearable\"\r\n [class]=\"getClasses\"\r\n [searchable]=\"searchable\"\r\n [closeOnSelect]=\"closeOnSelect\"\r\n [searchFn]=\"customSearchFn\"\r\n [notFoundText]=\"notFoundText\"\r\n [maxlength]=\"maxLength.toString() || 'none'\"\r\n [dropdownPosition]=\"dropdownPosition\"\r\n clearAllText=\"\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C\"\r\n addTagText=\"\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C\"\r\n loadingText=\"\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430...\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n (search)=\"updateSearch($event)\"\r\n >\r\n <ng-template ng-label-tmp let-item=\"item\" *ngIf=\"disabled && disabledFromDisplay\">\r\n {{ displayValue }}\r\n </ng-template>\r\n <ng-template ng-option-tmp let-item=\"item\" let-clear=\"clear\" *ngIf=\"selectOptionsTemplate\">\r\n <ng-container *ngTemplateOutlet=\"selectOptionsTemplate; context:{item: item, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\" *ngIf=\"labelTemplate\">\r\n <ng-container *ngTemplateOutlet=\"labelTemplate; context:{item: item, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-tag-tmp let-items=\"items\" *ngIf=\"tagTemplate\">\r\n <ng-container *ngTemplateOutlet=\"tagTemplate; context:{items: items}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-loadingtext-tmp>\r\n <div class=\"ng-option disabled\">{{ loadLabel || '\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430' }}</div>\r\n </ng-template>\r\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\" *ngIf=\"multiLabelTemplate\">\r\n <ng-container *ngTemplateOutlet=\"multiLabelTemplate; context:{items: items, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\" *ngIf=\"multiCollapseCount\">\r\n <ng-container *ngIf=\"value.length < multiCollapseCount\">\r\n <div class=\"ng-value\" *ngFor=\"let item of items\">\r\n <span class=\"ng-value-label\">{{ item['label'] }}</span>\r\n <span class=\"ng-value-icon right\" (click)=\"clear(item)\">\u00D7</span>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"value.length >= multiCollapseCount\" class=\"ng-summary-list\">\r\n <div class=\"ng-value ng-value-empty\">\r\n <span class=\"ng-value-label\">\u0412\u044B\u0431\u0440\u0430\u043D\u043E: {{ value.length }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template ng-loadingspinner-tmp>\r\n <mrx-loader\r\n [ngStyle]=\"{display: 'flex'}\"\r\n [color]=\"'brand'\" size=\"small\"\r\n customClasses=\"align-self-center mr-2\"\r\n ></mrx-loader>\r\n </ng-template>\r\n </ng-select>\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 [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [":host::ng-deep .mrx-input-select{position:relative}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container{background-color:var(--neutral-bg-disabled)}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container:hover:before{border-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container .ng-arrow-wrapper .ng-arrow:after{color:var(--neutral-icon-disabled)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container{align-items:flex-start;padding:var(--spacing-2);padding-right:var(--spacing-3);box-sizing:border-box;border:none!important;border-radius:var(--border-radius-1)!important;width:100%;height:auto;outline:none;transition:outline-width .2s,border .2s;z-index:1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:before{content:\"\";position:absolute;left:0;top:0;width:100%;height:100%;border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);transition:.2s;z-index:-1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container.ng-has-value .ng-placeholder{display:none}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:focus,:host::ng-deep .mrx-input-select .ng-select .ng-select-container:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)!important}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:hover:before{border-color:var(--neutral-bg-stroke-hover)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container{display:flex;align-items:center;position:relative;padding:var(--spacing-1) var(--spacing-2)!important;min-height:var(--sizing-8)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-placeholder{top:revert!important;color:var(--neutral-text-tertiary)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value{display:flex;align-items:center;white-space:nowrap}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-label{overflow:hidden;font-size:var(--body-md-font-size);line-height:var(--body-md-line-height)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{color:transparent}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-input{display:flex;align-items:center;height:auto;padding-left:var(--spacing-2)!important;z-index:-1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-input>input{position:relative;z-index:-1;padding:0;transform:none;padding-right:var(--spacing-2)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .mrx-loader{transform:translateY(4px)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper{display:flex;align-items:center;justify-content:center;padding:0;transform:translateY(4px)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-arrow{font-size:0;position:relative;width:100%!important;height:100%!important;background-image:none;line-height:normal;border-radius:var(--border-radius-1)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-arrow:after{content:\"\";position:absolute;inset:0;width:100%;height:100%;font-family:mrx-icon-font;font-size:var(--body-extra-lg-font-size);color:var(--neutral-icon-default)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:hover .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:hover .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:focus .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:focus .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:hover .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:hover .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:focus .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:focus .ng-arrow{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper{margin-right:var(--spacing-2)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear:after{content:\"\\e92b\"}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:after{content:\"\\e923\"}:host::ng-deep .mrx-input-select .ng-select.ng-select-opened .ng-select-container{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-opened .ng-arrow-wrapper .ng-arrow{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable .ng-has-value .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container.ng-has-value .ng-value-container{max-width:calc(100% - 88px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.mrx-input-loading .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple .ng-value-container{max-width:calc(100% - var(--sizing-6))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple .ng-value-container .ng-value{min-height:var(--sizing-8)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container{min-height:var(--sizing-12)!important}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container .ng-clear-wrapper,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container .ng-arrow-wrapper{width:var(--sizing-6)!important;min-width:var(--sizing-6);height:var(--sizing-6);min-height:var(--sizing-6)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable .ng-has-value .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container.ng-has-value .ng-value-container{max-width:calc(100% - 64px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.mrx-input-loading .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container{min-height:var(--sizing-10)!important}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container{padding:0 var(--spacing-2) 0 var(--spacing-2)!important;min-height:var(--sizing-6);max-width:calc(100% - var(--sizing-4))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container .ng-value{margin-bottom:0;min-height:var(--sizing-6)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .mrx-loader{width:var(--sizing-4);height:var(--sizing-4)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper{width:var(--sizing-4)!important;min-width:var(--sizing-4);height:var(--sizing-4);min-height:var(--sizing-4)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper .ng-arrow:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper .ng-arrow:after{font-size:var(--body-lg-font-size)}:host::ng-deep .mrx-input-select .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value .ng-value-label{text-overflow:ellipsis!important;overflow:hidden;max-width:100%!important;display:block;white-space:nowrap}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container.ng-has-value .ng-value-container{gap:var(--spacing-2);padding:0!important;padding-right:var(--spacing-2)!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{display:flex;flex-direction:row;width:100%;max-width:max-content;margin:0;background:var(--brand-bg-secondary-default);border-radius:var(--border-radius-1);padding:0;padding-left:var(--spacing-2);padding-right:var(--spacing-1)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-empty{padding-right:var(--spacing-3)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{color:var(--neutral-text-primary);padding-right:var(--spacing-1);text-overflow:ellipsis!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{position:relative;min-width:var(--sizing-4);min-height:var(--sizing-4);order:1}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:after{content:\"\\e92b\";position:absolute;left:0;top:0;width:100%;height:100%;font-family:mrx-icon-font;font-size:var(--body-lg-font-size);color:var(--neutral-icon-default)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input>input{font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);transform:none!important}:host::ng-deep .mrx-input-select .ng-dropdown-panel{z-index:900;background:var(--brand-bg-tertiary-default);box-shadow:0 4px 10px #3a3a3a26;border-radius:var(--border-radius-1);margin-top:var(--spacing-1);border:none}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items{border-radius:var(--border-radius-1)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar{width:8px;background-color:transparent}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-track{border-radius:var(--border-radius-2);background-color:transparent}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-thumb{border-radius:var(--border-radius-2);background-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{min-height:var(--sizing-10);transition:.2s;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-4);white-space:normal}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:var(--spacing-6)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option span{display:flex;align-items:center;font-size:var(--body-md-font-size);line-height:var(--body-md-line-height)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background:var(--brand-bg-tertiary-default);color:var(--neutral-text-primary)!important}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background:var(--brand-bg-tertiary-default);position:relative;padding-right:40px;color:var(--neutral-text-primary)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-label{font-weight:400}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected:before{content:url(\"data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3336 4.6665L6.00032 11.9998L2.66699 8.66649' stroke='%23000' stroke-width='0.999998' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");position:absolute;top:50%;transform:translateY(-50%);right:16px;line-height:0}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option:hover{background:var(--brand-bg-secondary-default)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{min-height:var(--sizing-10);transition:.2s;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-4);white-space:normal;color:var(--neutral-text-tertiary);font-weight:700}:host::ng-deep .mrx-input-select.mrx-input-error{display:block}:host::ng-deep .mrx-input-select.mrx-input-error .ng-select .ng-select-container:before{border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-error.ng-select .ng-select-container{background-color:var(--system-bg-negative-secondary)}:host::ng-deep .mrx-input-select .mrx-input-checked-error.ng-select .ng-select-container:hover{border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container{background-color:var(--system-bg-positive-secondary)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container:before{border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}:host::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-summary-list .ng-value{max-width:100%!important}:host::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-summary-list .ng-value .ng-value-label{text-overflow:initial!important;overflow:initial}\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: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }, { kind: "component", type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { kind: "component", type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { kind: "component", type: i6.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i6.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i6.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i6.NgMultiLabelTemplateDirective, selector: "[ng-multi-label-tmp]" }, { kind: "directive", type: i6.NgLoadingTextTemplateDirective, selector: "[ng-loadingtext-tmp]" }, { kind: "directive", type: i6.NgTagTemplateDirective, selector: "[ng-tag-tmp]" }, { kind: "directive", type: i6.NgLoadingSpinnerTemplateDirective, selector: "[ng-loadingspinner-tmp]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2323
2324
|
}
|
|
2324
2325
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputSelectComponent, decorators: [{
|
|
2325
2326
|
type: Component,
|
|
@@ -2329,7 +2330,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
2329
2330
|
useExisting: forwardRef(() => InputSelectComponent),
|
|
2330
2331
|
multi: true,
|
|
2331
2332
|
},
|
|
2332
|
-
], template: "<div class=\"mrx-input-select\" [class.mrx-input-error]=\"invalid\" [class]=\"wrapperCustomClasses\">\r\n <div [class.inputbox-error]=\"showEmptyFields && required && !isVerified\"\r\n [class.inputbox-success]=\"showEmptyFields && required && isVerified\">\r\n\r\n <ng-select\r\n [items]=\"items\"\r\n [ngModel]=\"value\"\r\n [addTag]=\"addTag\"\r\n [bindValue]=\"bindValue\"\r\n [bindLabel]=\"bindLabel\"\r\n [multiple]=\"multiple\"\r\n [maxSelectedItems]=\"maxSelectedItems\"\r\n [groupBy]=\"groupBy ? groupBy : ''\"\r\n [placeholder]=\"placeholder\"\r\n [trackByFn]=\"trackByFn\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [loading]=\"loading\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [clearable]=\"clearable\"\r\n [class]=\"getClasses\"\r\n [searchable]=\"searchable\"\r\n [closeOnSelect]=\"closeOnSelect\"\r\n [searchFn]=\"customSearchFn\"\r\n [notFoundText]=\"notFoundText\"\r\n [maxlength]=\"maxLength.toString() || 'none'\"\r\n clearAllText=\"\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C\"\r\n addTagText=\"\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C\"\r\n loadingText=\"\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430...\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n (search)=\"updateSearch($event)\"\r\n >\r\n <ng-template ng-label-tmp let-item=\"item\" *ngIf=\"disabled && disabledFromDisplay\">\r\n {{ displayValue }}\r\n </ng-template>\r\n <ng-template ng-option-tmp let-item=\"item\" let-clear=\"clear\" *ngIf=\"selectOptionsTemplate\">\r\n <ng-container *ngTemplateOutlet=\"selectOptionsTemplate; context:{item: item, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\" *ngIf=\"labelTemplate\">\r\n <ng-container *ngTemplateOutlet=\"labelTemplate; context:{item: item, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-tag-tmp let-items=\"items\" *ngIf=\"tagTemplate\">\r\n <ng-container *ngTemplateOutlet=\"tagTemplate; context:{items: items}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-loadingtext-tmp>\r\n <div class=\"ng-option disabled\">{{ loadLabel || '\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430' }}</div>\r\n </ng-template>\r\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\" *ngIf=\"multiLabelTemplate\">\r\n <ng-container *ngTemplateOutlet=\"multiLabelTemplate; context:{items: items, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\" *ngIf=\"multiCollapseCount\">\r\n <ng-container *ngIf=\"value.length < multiCollapseCount\">\r\n <div class=\"ng-value\" *ngFor=\"let item of items\">\r\n <span class=\"ng-value-label\">{{ item['label'] }}</span>\r\n <span class=\"ng-value-icon right\" (click)=\"clear(item)\">\u00D7</span>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"value.length >= multiCollapseCount\" class=\"ng-summary-list\">\r\n <div class=\"ng-value ng-value-empty\">\r\n <span class=\"ng-value-label\">\u0412\u044B\u0431\u0440\u0430\u043D\u043E: {{ value.length }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template ng-loadingspinner-tmp>\r\n <mrx-loader\r\n [ngStyle]=\"{display: 'flex'}\"\r\n [color]=\"'brand'\" size=\"small\"\r\n customClasses=\"align-self-center mr-2\"\r\n ></mrx-loader>\r\n </ng-template>\r\n </ng-select>\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 [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [":host::ng-deep .mrx-input-select{position:relative}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container{background-color:var(--neutral-bg-disabled)}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container:hover:before{border-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container .ng-arrow-wrapper .ng-arrow:after{color:var(--neutral-icon-disabled)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container{align-items:flex-start;padding:var(--spacing-2);padding-right:var(--spacing-3);box-sizing:border-box;border:none!important;border-radius:var(--border-radius-1)!important;width:100%;height:auto;outline:none;transition:outline-width .2s,border .2s;z-index:1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:before{content:\"\";position:absolute;left:0;top:0;width:100%;height:100%;border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);transition:.2s;z-index:-1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container.ng-has-value .ng-placeholder{display:none}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:focus,:host::ng-deep .mrx-input-select .ng-select .ng-select-container:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)!important}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:hover:before{border-color:var(--neutral-bg-stroke-hover)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container{display:flex;align-items:center;position:relative;padding:var(--spacing-1) var(--spacing-2)!important;min-height:var(--sizing-8)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-placeholder{top:revert!important;color:var(--neutral-text-tertiary)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value{display:flex;align-items:center;white-space:nowrap}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-label{overflow:hidden;font-size:var(--body-md-font-size);line-height:var(--body-md-line-height)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{color:transparent}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-input{display:flex;align-items:center;height:auto;padding-left:var(--spacing-2)!important;z-index:-1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-input>input{position:relative;z-index:-1;padding:0;transform:none;padding-right:var(--spacing-2)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .mrx-loader{transform:translateY(4px)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper{display:flex;align-items:center;justify-content:center;padding:0;transform:translateY(4px)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-arrow{font-size:0;position:relative;width:100%!important;height:100%!important;background-image:none;line-height:normal;border-radius:var(--border-radius-1)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-arrow:after{content:\"\";position:absolute;inset:0;width:100%;height:100%;font-family:mrx-icon-font;font-size:var(--body-extra-lg-font-size);color:var(--neutral-icon-default)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:hover .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:hover .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:focus .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:focus .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:hover .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:hover .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:focus .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:focus .ng-arrow{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper{margin-right:var(--spacing-2)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear:after{content:\"\\e92b\"}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:after{content:\"\\e923\"}:host::ng-deep .mrx-input-select .ng-select.ng-select-opened .ng-select-container{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-opened .ng-arrow-wrapper .ng-arrow{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable .ng-has-value .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container.ng-has-value .ng-value-container{max-width:calc(100% - 88px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.mrx-input-loading .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple .ng-value-container{max-width:calc(100% - var(--sizing-6))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple .ng-value-container .ng-value{min-height:var(--sizing-8)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container{min-height:var(--sizing-12)!important}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container .ng-clear-wrapper,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container .ng-arrow-wrapper{width:var(--sizing-6)!important;min-width:var(--sizing-6);height:var(--sizing-6);min-height:var(--sizing-6)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable .ng-has-value .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container.ng-has-value .ng-value-container{max-width:calc(100% - 64px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.mrx-input-loading .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container{min-height:var(--sizing-10)!important}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container{padding:0 var(--spacing-2) 0 var(--spacing-2)!important;min-height:var(--sizing-6);max-width:calc(100% - var(--sizing-4))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container .ng-value{margin-bottom:0;min-height:var(--sizing-6)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .mrx-loader{width:var(--sizing-4);height:var(--sizing-4)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper{width:var(--sizing-4)!important;min-width:var(--sizing-4);height:var(--sizing-4);min-height:var(--sizing-4)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper .ng-arrow:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper .ng-arrow:after{font-size:var(--body-lg-font-size)}:host::ng-deep .mrx-input-select .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value .ng-value-label{text-overflow:ellipsis!important;overflow:hidden;max-width:100%!important;display:block;white-space:nowrap}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container.ng-has-value .ng-value-container{gap:var(--spacing-2);padding:0!important;padding-right:var(--spacing-2)!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{display:flex;flex-direction:row;width:100%;max-width:max-content;margin:0;background:var(--brand-bg-secondary-default);border-radius:var(--border-radius-1);padding:0;padding-left:var(--spacing-2);padding-right:var(--spacing-1)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-empty{padding-right:var(--spacing-3)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{color:var(--neutral-text-primary);padding-right:var(--spacing-1);text-overflow:ellipsis!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{position:relative;min-width:var(--sizing-4);min-height:var(--sizing-4);order:1}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:after{content:\"\\e92b\";position:absolute;left:0;top:0;width:100%;height:100%;font-family:mrx-icon-font;font-size:var(--body-lg-font-size);color:var(--neutral-icon-default)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input>input{font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);transform:none!important}:host::ng-deep .mrx-input-select .ng-dropdown-panel{z-index:900;background:var(--brand-bg-tertiary-default);box-shadow:0 4px 10px #3a3a3a26;border-radius:var(--border-radius-1);margin-top:var(--spacing-1);border:none}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items{border-radius:var(--border-radius-1)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar{width:8px;background-color:transparent}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-track{border-radius:var(--border-radius-2);background-color:transparent}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-thumb{border-radius:var(--border-radius-2);background-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{min-height:var(--sizing-10);transition:.2s;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-4);white-space:normal}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:var(--spacing-6)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option span{display:flex;align-items:center;font-size:var(--body-md-font-size);line-height:var(--body-md-line-height)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background:var(--brand-bg-tertiary-default);color:var(--neutral-text-primary)!important}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background:var(--brand-bg-tertiary-default);position:relative;padding-right:40px;color:var(--neutral-text-primary)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-label{font-weight:400}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected:before{content:url(\"data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3336 4.6665L6.00032 11.9998L2.66699 8.66649' stroke='%23000' stroke-width='0.999998' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");position:absolute;top:50%;transform:translateY(-50%);right:16px;line-height:0}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option:hover{background:var(--brand-bg-secondary-default)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{min-height:var(--sizing-10);transition:.2s;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-4);white-space:normal;color:var(--neutral-text-tertiary);font-weight:700}:host::ng-deep .mrx-input-select.mrx-input-error{display:block}:host::ng-deep .mrx-input-select.mrx-input-error .ng-select .ng-select-container:before{border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-error.ng-select .ng-select-container{background-color:var(--system-bg-negative-secondary)}:host::ng-deep .mrx-input-select .mrx-input-checked-error.ng-select .ng-select-container:hover{border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container{background-color:var(--system-bg-positive-secondary)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container:before{border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}:host::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-summary-list .ng-value{max-width:100%!important}:host::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-summary-list .ng-value .ng-value-label{text-overflow:initial!important;overflow:initial}\n"] }]
|
|
2333
|
+
], template: "<div class=\"mrx-input-select\" [class.mrx-input-error]=\"invalid\" [class]=\"wrapperCustomClasses\">\r\n <div [class.inputbox-error]=\"showEmptyFields && required && !isVerified\"\r\n [class.inputbox-success]=\"showEmptyFields && required && isVerified\">\r\n\r\n <ng-select\r\n [items]=\"items\"\r\n [ngModel]=\"value\"\r\n [addTag]=\"addTag\"\r\n [bindValue]=\"bindValue\"\r\n [bindLabel]=\"bindLabel\"\r\n [multiple]=\"multiple\"\r\n [maxSelectedItems]=\"maxSelectedItems\"\r\n [groupBy]=\"groupBy ? groupBy : ''\"\r\n [placeholder]=\"placeholder\"\r\n [trackByFn]=\"trackByFn\"\r\n [virtualScroll]=\"virtualScroll\"\r\n [loading]=\"loading\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [clearable]=\"clearable\"\r\n [class]=\"getClasses\"\r\n [searchable]=\"searchable\"\r\n [closeOnSelect]=\"closeOnSelect\"\r\n [searchFn]=\"customSearchFn\"\r\n [notFoundText]=\"notFoundText\"\r\n [maxlength]=\"maxLength.toString() || 'none'\"\r\n [dropdownPosition]=\"dropdownPosition\"\r\n clearAllText=\"\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C\"\r\n addTagText=\"\u0414\u043E\u0431\u0430\u0432\u0438\u0442\u044C\"\r\n loadingText=\"\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430...\"\r\n (ngModelChange)=\"updateValue($event)\"\r\n (search)=\"updateSearch($event)\"\r\n >\r\n <ng-template ng-label-tmp let-item=\"item\" *ngIf=\"disabled && disabledFromDisplay\">\r\n {{ displayValue }}\r\n </ng-template>\r\n <ng-template ng-option-tmp let-item=\"item\" let-clear=\"clear\" *ngIf=\"selectOptionsTemplate\">\r\n <ng-container *ngTemplateOutlet=\"selectOptionsTemplate; context:{item: item, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\" *ngIf=\"labelTemplate\">\r\n <ng-container *ngTemplateOutlet=\"labelTemplate; context:{item: item, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-tag-tmp let-items=\"items\" *ngIf=\"tagTemplate\">\r\n <ng-container *ngTemplateOutlet=\"tagTemplate; context:{items: items}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-loadingtext-tmp>\r\n <div class=\"ng-option disabled\">{{ loadLabel || '\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430' }}</div>\r\n </ng-template>\r\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\" *ngIf=\"multiLabelTemplate\">\r\n <ng-container *ngTemplateOutlet=\"multiLabelTemplate; context:{items: items, clear: clear}\"></ng-container>\r\n </ng-template>\r\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\" *ngIf=\"multiCollapseCount\">\r\n <ng-container *ngIf=\"value.length < multiCollapseCount\">\r\n <div class=\"ng-value\" *ngFor=\"let item of items\">\r\n <span class=\"ng-value-label\">{{ item['label'] }}</span>\r\n <span class=\"ng-value-icon right\" (click)=\"clear(item)\">\u00D7</span>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"value.length >= multiCollapseCount\" class=\"ng-summary-list\">\r\n <div class=\"ng-value ng-value-empty\">\r\n <span class=\"ng-value-label\">\u0412\u044B\u0431\u0440\u0430\u043D\u043E: {{ value.length }}</span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template ng-loadingspinner-tmp>\r\n <mrx-loader\r\n [ngStyle]=\"{display: 'flex'}\"\r\n [color]=\"'brand'\" size=\"small\"\r\n customClasses=\"align-self-center mr-2\"\r\n ></mrx-loader>\r\n </ng-template>\r\n </ng-select>\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 [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [":host::ng-deep .mrx-input-select{position:relative}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container{background-color:var(--neutral-bg-disabled)}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container:hover:before{border-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-input-select .ng-select.ng-select-disabled .ng-select-container .ng-arrow-wrapper .ng-arrow:after{color:var(--neutral-icon-disabled)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container{align-items:flex-start;padding:var(--spacing-2);padding-right:var(--spacing-3);box-sizing:border-box;border:none!important;border-radius:var(--border-radius-1)!important;width:100%;height:auto;outline:none;transition:outline-width .2s,border .2s;z-index:1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:before{content:\"\";position:absolute;left:0;top:0;width:100%;height:100%;border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);transition:.2s;z-index:-1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container.ng-has-value .ng-placeholder{display:none}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:focus,:host::ng-deep .mrx-input-select .ng-select .ng-select-container:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)!important}:host::ng-deep .mrx-input-select .ng-select .ng-select-container:hover:before{border-color:var(--neutral-bg-stroke-hover)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container{display:flex;align-items:center;position:relative;padding:var(--spacing-1) var(--spacing-2)!important;min-height:var(--sizing-8)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-placeholder{top:revert!important;color:var(--neutral-text-tertiary)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value{display:flex;align-items:center;white-space:nowrap}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-label{overflow:hidden;font-size:var(--body-md-font-size);line-height:var(--body-md-line-height)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-value .ng-value-icon{color:transparent}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-input{display:flex;align-items:center;height:auto;padding-left:var(--spacing-2)!important;z-index:-1}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-value-container .ng-input>input{position:relative;z-index:-1;padding:0;transform:none;padding-right:var(--spacing-2)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .mrx-loader{transform:translateY(4px)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper{display:flex;align-items:center;justify-content:center;padding:0;transform:translateY(4px)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-arrow{font-size:0;position:relative;width:100%!important;height:100%!important;background-image:none;line-height:normal;border-radius:var(--border-radius-1)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:after,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-arrow:after{content:\"\";position:absolute;inset:0;width:100%;height:100%;font-family:mrx-icon-font;font-size:var(--body-extra-lg-font-size);color:var(--neutral-icon-default)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:hover .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:hover .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:focus .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:focus .ng-clear,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:hover .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:hover .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper:focus .ng-arrow,:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper:focus .ng-arrow{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper{margin-right:var(--spacing-2)}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-clear-wrapper .ng-clear:after{content:\"\\e92b\"}:host::ng-deep .mrx-input-select .ng-select .ng-select-container .ng-arrow-wrapper .ng-arrow:after{content:\"\\e923\"}:host::ng-deep .mrx-input-select .ng-select.ng-select-opened .ng-select-container{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-opened .ng-arrow-wrapper .ng-arrow{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable .ng-has-value .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container.ng-has-value .ng-value-container{max-width:calc(100% - 88px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple.mrx-input-loading .ng-value-container{max-width:calc(100% - 56px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple .ng-value-container{max-width:calc(100% - var(--sizing-6))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg.ng-select-multiple .ng-value-container .ng-value{min-height:var(--sizing-8)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container{min-height:var(--sizing-12)!important}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container .ng-clear-wrapper,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-lg .ng-select-container .ng-arrow-wrapper{width:var(--sizing-6)!important;min-width:var(--sizing-6);height:var(--sizing-6);min-height:var(--sizing-6)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable .ng-has-value .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container.ng-has-value .ng-value-container{max-width:calc(100% - 64px)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.ng-select-clearable.mrx-input-loading .ng-select-container .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple.mrx-input-loading .ng-value-container{max-width:calc(100% - var(--sizing-10))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container{min-height:var(--sizing-10)!important}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container{padding:0 var(--spacing-2) 0 var(--spacing-2)!important;min-height:var(--sizing-6);max-width:calc(100% - var(--sizing-4))}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container .ng-value{margin-bottom:0;min-height:var(--sizing-6)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .mrx-loader{width:var(--sizing-4);height:var(--sizing-4)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper{width:var(--sizing-4)!important;min-width:var(--sizing-4);height:var(--sizing-4);min-height:var(--sizing-4)}:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper .ng-clear:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-clear-wrapper .ng-arrow:after,:host::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-arrow-wrapper .ng-arrow:after{font-size:var(--body-lg-font-size)}:host::ng-deep .mrx-input-select .ng-select.ng-select-single .ng-select-container .ng-value-container .ng-value .ng-value-label{text-overflow:ellipsis!important;overflow:hidden;max-width:100%!important;display:block;white-space:nowrap}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container.ng-has-value .ng-value-container{gap:var(--spacing-2);padding:0!important;padding-right:var(--spacing-2)!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{display:flex;flex-direction:row;width:100%;max-width:max-content;margin:0;background:var(--brand-bg-secondary-default);border-radius:var(--border-radius-1);padding:0;padding-left:var(--spacing-2);padding-right:var(--spacing-1)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-empty{padding-right:var(--spacing-3)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{color:var(--neutral-text-primary);padding-right:var(--spacing-1);text-overflow:ellipsis!important}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{position:relative;min-width:var(--sizing-4);min-height:var(--sizing-4);order:1}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:after{content:\"\\e92b\";position:absolute;left:0;top:0;width:100%;height:100%;font-family:mrx-icon-font;font-size:var(--body-lg-font-size);color:var(--neutral-icon-default)}:host::ng-deep .mrx-input-select .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-input>input{font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);transform:none!important}:host::ng-deep .mrx-input-select .ng-dropdown-panel{z-index:900;background:var(--brand-bg-tertiary-default);box-shadow:0 4px 10px #3a3a3a26;border-radius:var(--border-radius-1);margin-top:var(--spacing-1);border:none}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items{border-radius:var(--border-radius-1)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar{width:8px;background-color:transparent}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-track{border-radius:var(--border-radius-2);background-color:transparent}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items::-webkit-scrollbar-thumb{border-radius:var(--border-radius-2);background-color:var(--neutral-bg-stroke-default)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{min-height:var(--sizing-10);transition:.2s;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-4);white-space:normal}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:var(--spacing-6)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option span{display:flex;align-items:center;font-size:var(--body-md-font-size);line-height:var(--body-md-line-height)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background:var(--brand-bg-tertiary-default);color:var(--neutral-text-primary)!important}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background:var(--brand-bg-tertiary-default);position:relative;padding-right:40px;color:var(--neutral-text-primary)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected.ng-option-label{font-weight:400}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected:before{content:url(\"data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3336 4.6665L6.00032 11.9998L2.66699 8.66649' stroke='%23000' stroke-width='0.999998' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");position:absolute;top:50%;transform:translateY(-50%);right:16px;line-height:0}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-option:hover{background:var(--brand-bg-secondary-default)}:host::ng-deep .mrx-input-select .ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{min-height:var(--sizing-10);transition:.2s;display:flex;align-items:center;padding:var(--spacing-1) var(--spacing-4);white-space:normal;color:var(--neutral-text-tertiary);font-weight:700}:host::ng-deep .mrx-input-select.mrx-input-error{display:block}:host::ng-deep .mrx-input-select.mrx-input-error .ng-select .ng-select-container:before{border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-error.ng-select .ng-select-container{background-color:var(--system-bg-negative-secondary)}:host::ng-deep .mrx-input-select .mrx-input-checked-error.ng-select .ng-select-container:hover{border-color:var(--system-bg-controls-negative-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container{background-color:var(--system-bg-positive-secondary)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container:before{border-color:var(--system-bg-controls-positive-default)}:host::ng-deep .mrx-input-select .mrx-input-checked-success.ng-select .ng-select-container:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}:host::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-summary-list .ng-value{max-width:100%!important}:host::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-summary-list .ng-value .ng-value-label{text-overflow:initial!important;overflow:initial}\n"] }]
|
|
2333
2334
|
}], propDecorators: { fields: [{
|
|
2334
2335
|
type: Input
|
|
2335
2336
|
}], size: [{
|
|
@@ -2394,6 +2395,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
2394
2395
|
type: Input
|
|
2395
2396
|
}], multiCollapseCount: [{
|
|
2396
2397
|
type: Input
|
|
2398
|
+
}], dropdownPosition: [{
|
|
2399
|
+
type: Input
|
|
2397
2400
|
}], invalid: [{
|
|
2398
2401
|
type: Input
|
|
2399
2402
|
}], invalidMessage: [{
|
|
@@ -2446,6 +2449,7 @@ class PaginatorComponent {
|
|
|
2446
2449
|
isEmptyPaginator = false;
|
|
2447
2450
|
isPaginatorText = false;
|
|
2448
2451
|
paginatorText = 'записи';
|
|
2452
|
+
dropdownPosition = 'auto';
|
|
2449
2453
|
set setPosition(value) {
|
|
2450
2454
|
this.position = value || 'centered';
|
|
2451
2455
|
}
|
|
@@ -2538,11 +2542,11 @@ class PaginatorComponent {
|
|
|
2538
2542
|
return item.id;
|
|
2539
2543
|
}
|
|
2540
2544
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2541
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PaginatorComponent, selector: "mrx-paginator", inputs: { pageSizes: "pageSizes", currentPage: "currentPage", pageSize: "pageSize", total: "total", customClasses: "customClasses", isEmptyPaginator: "isEmptyPaginator", isPaginatorText: "isPaginatorText", paginatorText: "paginatorText", setPosition: ["position", "setPosition"], setWithPageSize: ["withPageSize", "setWithPageSize"] }, outputs: { dataStateChanged: "dataStateChanged" }, ngImport: i0, template: "<div class=\"mrx-paginator\" [class]=\"getClasses\" *ngIf=\"isEmptyPaginator || total\">\r\n <ul class=\"mrx-paginator__list\">\r\n <li\r\n class=\"mrx-paginator__previous\"\r\n [class.disabled]=\"currentPage <= 1\"\r\n (click)=\"currentPage > 1 && onChangeCurrentPage(currentPage - 1)\">\r\n <div class=\"mrx-icon icon-chevron-left icon-font-24\"></div>\r\n </li>\r\n\r\n <li *ngIf=\"getViewItems.length === 0\" class=\"mrx-paginator__item active\">1</li>\r\n\r\n <li class=\"mrx-paginator__item\" *ngIf=\"currentPage > 3 && getItems > 5\" (click)=\"onChangeCurrentPage(1)\">1</li>\r\n <li class=\"mrx-paginator__item dots\" *ngIf=\"currentPage > 3 && getItems > 5\">...</li>\r\n\r\n <li\r\n class=\"mrx-paginator__item\"\r\n *ngFor=\"let item of getViewItems; trackBy: trackByFn\"\r\n (click)=\"onChangeCurrentPage(item.index)\"\r\n [class.active]=\"currentPage === item.index\"\r\n >\r\n {{item.index}}\r\n </li>\r\n\r\n <li class=\"mrx-paginator__item dots\" *ngIf=\"currentPage < getItems - 2 && getItems > 5\">...</li>\r\n <li class=\"mrx-paginator__item\" *ngIf=\"currentPage < getItems - 2 && getItems > 5\"\r\n (click)=\"onChangeCurrentPage(getItems)\">{{getItems}}</li>\r\n\r\n <li\r\n class=\"mrx-paginator__next\"\r\n [class.disabled]=\"currentPage >= getItems\"\r\n (click)=\"currentPage < getItems && onChangeCurrentPage(currentPage + 1)\">\r\n <div class=\"mrx-icon icon-chevron-right icon-font-24\"></div>\r\n </li>\r\n </ul>\r\n\r\n <ng-template #select>\r\n <mrx-input-select\r\n *ngIf=\"withPageSize\"\r\n size=\"medium\"\r\n [(ngModel)]=\"pageSize\"\r\n [items]=\"pageSizes\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n
|
|
2545
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PaginatorComponent, selector: "mrx-paginator", inputs: { pageSizes: "pageSizes", currentPage: "currentPage", pageSize: "pageSize", total: "total", customClasses: "customClasses", isEmptyPaginator: "isEmptyPaginator", isPaginatorText: "isPaginatorText", paginatorText: "paginatorText", dropdownPosition: "dropdownPosition", setPosition: ["position", "setPosition"], setWithPageSize: ["withPageSize", "setWithPageSize"] }, outputs: { dataStateChanged: "dataStateChanged" }, ngImport: i0, template: "<div class=\"mrx-paginator\" [class]=\"getClasses\" *ngIf=\"isEmptyPaginator || total\">\r\n <ul class=\"mrx-paginator__list\">\r\n <li\r\n class=\"mrx-paginator__previous\"\r\n [class.disabled]=\"currentPage <= 1\"\r\n (click)=\"currentPage > 1 && onChangeCurrentPage(currentPage - 1)\">\r\n <div class=\"mrx-icon icon-chevron-left icon-font-24\"></div>\r\n </li>\r\n\r\n <li *ngIf=\"getViewItems.length === 0\" class=\"mrx-paginator__item active\">1</li>\r\n\r\n <li class=\"mrx-paginator__item\" *ngIf=\"currentPage > 3 && getItems > 5\" (click)=\"onChangeCurrentPage(1)\">1</li>\r\n <li class=\"mrx-paginator__item dots\" *ngIf=\"currentPage > 3 && getItems > 5\">...</li>\r\n\r\n <li\r\n class=\"mrx-paginator__item\"\r\n *ngFor=\"let item of getViewItems; trackBy: trackByFn\"\r\n (click)=\"onChangeCurrentPage(item.index)\"\r\n [class.active]=\"currentPage === item.index\"\r\n >\r\n {{item.index}}\r\n </li>\r\n\r\n <li class=\"mrx-paginator__item dots\" *ngIf=\"currentPage < getItems - 2 && getItems > 5\">...</li>\r\n <li class=\"mrx-paginator__item\" *ngIf=\"currentPage < getItems - 2 && getItems > 5\"\r\n (click)=\"onChangeCurrentPage(getItems)\">{{getItems}}</li>\r\n\r\n <li\r\n class=\"mrx-paginator__next\"\r\n [class.disabled]=\"currentPage >= getItems\"\r\n (click)=\"currentPage < getItems && onChangeCurrentPage(currentPage + 1)\">\r\n <div class=\"mrx-icon icon-chevron-right icon-font-24\"></div>\r\n </li>\r\n </ul>\r\n\r\n <ng-template #select>\r\n <mrx-input-select\r\n *ngIf=\"withPageSize\"\r\n size=\"medium\"\r\n [(ngModel)]=\"pageSize\"\r\n [items]=\"pageSizes\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n [dropdownPosition]=\"dropdownPosition\"\r\n (ngModelChange)=\"onChangePageSize($event)\"\r\n ></mrx-input-select>\r\n </ng-template>\r\n\r\n <ng-container *ngTemplateOutlet=\"select\"></ng-container>\r\n\r\n <div *ngIf=\"isPaginatorText\" class=\"mrx-paginator__text\">\r\n \u041E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u044B {{paginatorText}} {{getFirstNumberCurrentPage}} - {{getLastNumberCurrentPage}} \u0438\u0437 {{total}}\r\n </div>\r\n</div>\r\n\r\n\r\n", styles: [":host::ng-deep .mrx-paginator{display:flex;align-items:center;list-style:none;padding-left:0;gap:var(--spacing-4)}:host::ng-deep .mrx-paginator .mrx-input-select .ng-select .ng-select-container{padding-left:var(--spacing-4)}:host::ng-deep .mrx-paginator .mrx-input-select .ng-select .ng-select-container .ng-value-container{min-width:36px;padding:0!important;min-height:auto}:host::ng-deep .mrx-paginator ul{display:flex;align-items:center;justify-content:center;list-style:none;padding:0;margin:0;gap:var(--spacing-1)}:host::ng-deep .mrx-paginator ul li{display:flex;align-items:center;justify-content:center;cursor:pointer}:host::ng-deep .mrx-paginator .mrx-paginator__item{padding-left:var(--spacing-3);padding-right:var(--spacing-3);min-width:32px;min-height:32px;border-radius:4px;font-weight:400;font-size:16px;line-height:24px;transition:.2s}:host::ng-deep .mrx-paginator .mrx-paginator__item.active{background-color:var(--brand-bg-primary-default);color:#fff}:host::ng-deep .mrx-paginator .mrx-paginator__item.dots,:host::ng-deep .mrx-paginator .mrx-paginator__item.disabled{cursor:default}:host::ng-deep .mrx-paginator .mrx-paginator__item:not(.dots,.active):hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-paginator .mrx-paginator__previous,:host::ng-deep .mrx-paginator .mrx-paginator__next{min-width:24px;min-height:24px}:host::ng-deep .mrx-paginator .mrx-paginator__previous.disabled .mrx-icon,:host::ng-deep .mrx-paginator .mrx-paginator__next.disabled .mrx-icon{color:var(--neutral-icon-disabled)}:host::ng-deep .mrx-paginator__text{font-size:16px;line-height:24px;color:var(--neutral-text-primary)}.mrx-paginator.mrx-paginator.paginator-centered{justify-content:center}.mrx-paginator.mrx-paginator.paginator-left{justify-content:flex-start}.mrx-paginator.mrx-paginator.paginator-right{justify-content:flex-end}\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: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: InputSelectComponent, selector: "mrx-input-select", inputs: ["fields", "size", "selected", "bindValue", "bindLabel", "customClasses", "wrapperCustomClasses", "multiple", "loading", "addTag", "clearable", "items", "groupBy", "emptyValue", "virtualScroll", "trackByFn", "displayValue", "disabledFromDisplay", "maxLength", "customSearchFn", "isBottomLabel", "search", "required", "disabled", "readonly", "showEmptyFields", "placeholder", "searchable", "loadLabel", "notFoundText", "closeOnSelect", "multiCollapseCount", "dropdownPosition", "invalid", "invalidMessage", "checkInvalid", "label", "labelRequiredHidden", "labelExtraClass", "tooltip", "tooltipHidden", "tooltipVisible", "maxSelectedItems"], outputs: ["changed", "modelChange", "searched"] }] });
|
|
2542
2546
|
}
|
|
2543
2547
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PaginatorComponent, decorators: [{
|
|
2544
2548
|
type: Component,
|
|
2545
|
-
args: [{ selector: 'mrx-paginator', template: "<div class=\"mrx-paginator\" [class]=\"getClasses\" *ngIf=\"isEmptyPaginator || total\">\r\n <ul class=\"mrx-paginator__list\">\r\n <li\r\n class=\"mrx-paginator__previous\"\r\n [class.disabled]=\"currentPage <= 1\"\r\n (click)=\"currentPage > 1 && onChangeCurrentPage(currentPage - 1)\">\r\n <div class=\"mrx-icon icon-chevron-left icon-font-24\"></div>\r\n </li>\r\n\r\n <li *ngIf=\"getViewItems.length === 0\" class=\"mrx-paginator__item active\">1</li>\r\n\r\n <li class=\"mrx-paginator__item\" *ngIf=\"currentPage > 3 && getItems > 5\" (click)=\"onChangeCurrentPage(1)\">1</li>\r\n <li class=\"mrx-paginator__item dots\" *ngIf=\"currentPage > 3 && getItems > 5\">...</li>\r\n\r\n <li\r\n class=\"mrx-paginator__item\"\r\n *ngFor=\"let item of getViewItems; trackBy: trackByFn\"\r\n (click)=\"onChangeCurrentPage(item.index)\"\r\n [class.active]=\"currentPage === item.index\"\r\n >\r\n {{item.index}}\r\n </li>\r\n\r\n <li class=\"mrx-paginator__item dots\" *ngIf=\"currentPage < getItems - 2 && getItems > 5\">...</li>\r\n <li class=\"mrx-paginator__item\" *ngIf=\"currentPage < getItems - 2 && getItems > 5\"\r\n (click)=\"onChangeCurrentPage(getItems)\">{{getItems}}</li>\r\n\r\n <li\r\n class=\"mrx-paginator__next\"\r\n [class.disabled]=\"currentPage >= getItems\"\r\n (click)=\"currentPage < getItems && onChangeCurrentPage(currentPage + 1)\">\r\n <div class=\"mrx-icon icon-chevron-right icon-font-24\"></div>\r\n </li>\r\n </ul>\r\n\r\n <ng-template #select>\r\n <mrx-input-select\r\n *ngIf=\"withPageSize\"\r\n size=\"medium\"\r\n [(ngModel)]=\"pageSize\"\r\n [items]=\"pageSizes\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n
|
|
2549
|
+
args: [{ selector: 'mrx-paginator', template: "<div class=\"mrx-paginator\" [class]=\"getClasses\" *ngIf=\"isEmptyPaginator || total\">\r\n <ul class=\"mrx-paginator__list\">\r\n <li\r\n class=\"mrx-paginator__previous\"\r\n [class.disabled]=\"currentPage <= 1\"\r\n (click)=\"currentPage > 1 && onChangeCurrentPage(currentPage - 1)\">\r\n <div class=\"mrx-icon icon-chevron-left icon-font-24\"></div>\r\n </li>\r\n\r\n <li *ngIf=\"getViewItems.length === 0\" class=\"mrx-paginator__item active\">1</li>\r\n\r\n <li class=\"mrx-paginator__item\" *ngIf=\"currentPage > 3 && getItems > 5\" (click)=\"onChangeCurrentPage(1)\">1</li>\r\n <li class=\"mrx-paginator__item dots\" *ngIf=\"currentPage > 3 && getItems > 5\">...</li>\r\n\r\n <li\r\n class=\"mrx-paginator__item\"\r\n *ngFor=\"let item of getViewItems; trackBy: trackByFn\"\r\n (click)=\"onChangeCurrentPage(item.index)\"\r\n [class.active]=\"currentPage === item.index\"\r\n >\r\n {{item.index}}\r\n </li>\r\n\r\n <li class=\"mrx-paginator__item dots\" *ngIf=\"currentPage < getItems - 2 && getItems > 5\">...</li>\r\n <li class=\"mrx-paginator__item\" *ngIf=\"currentPage < getItems - 2 && getItems > 5\"\r\n (click)=\"onChangeCurrentPage(getItems)\">{{getItems}}</li>\r\n\r\n <li\r\n class=\"mrx-paginator__next\"\r\n [class.disabled]=\"currentPage >= getItems\"\r\n (click)=\"currentPage < getItems && onChangeCurrentPage(currentPage + 1)\">\r\n <div class=\"mrx-icon icon-chevron-right icon-font-24\"></div>\r\n </li>\r\n </ul>\r\n\r\n <ng-template #select>\r\n <mrx-input-select\r\n *ngIf=\"withPageSize\"\r\n size=\"medium\"\r\n [(ngModel)]=\"pageSize\"\r\n [items]=\"pageSizes\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n [dropdownPosition]=\"dropdownPosition\"\r\n (ngModelChange)=\"onChangePageSize($event)\"\r\n ></mrx-input-select>\r\n </ng-template>\r\n\r\n <ng-container *ngTemplateOutlet=\"select\"></ng-container>\r\n\r\n <div *ngIf=\"isPaginatorText\" class=\"mrx-paginator__text\">\r\n \u041E\u0442\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u044B {{paginatorText}} {{getFirstNumberCurrentPage}} - {{getLastNumberCurrentPage}} \u0438\u0437 {{total}}\r\n </div>\r\n</div>\r\n\r\n\r\n", styles: [":host::ng-deep .mrx-paginator{display:flex;align-items:center;list-style:none;padding-left:0;gap:var(--spacing-4)}:host::ng-deep .mrx-paginator .mrx-input-select .ng-select .ng-select-container{padding-left:var(--spacing-4)}:host::ng-deep .mrx-paginator .mrx-input-select .ng-select .ng-select-container .ng-value-container{min-width:36px;padding:0!important;min-height:auto}:host::ng-deep .mrx-paginator ul{display:flex;align-items:center;justify-content:center;list-style:none;padding:0;margin:0;gap:var(--spacing-1)}:host::ng-deep .mrx-paginator ul li{display:flex;align-items:center;justify-content:center;cursor:pointer}:host::ng-deep .mrx-paginator .mrx-paginator__item{padding-left:var(--spacing-3);padding-right:var(--spacing-3);min-width:32px;min-height:32px;border-radius:4px;font-weight:400;font-size:16px;line-height:24px;transition:.2s}:host::ng-deep .mrx-paginator .mrx-paginator__item.active{background-color:var(--brand-bg-primary-default);color:#fff}:host::ng-deep .mrx-paginator .mrx-paginator__item.dots,:host::ng-deep .mrx-paginator .mrx-paginator__item.disabled{cursor:default}:host::ng-deep .mrx-paginator .mrx-paginator__item:not(.dots,.active):hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-paginator .mrx-paginator__previous,:host::ng-deep .mrx-paginator .mrx-paginator__next{min-width:24px;min-height:24px}:host::ng-deep .mrx-paginator .mrx-paginator__previous.disabled .mrx-icon,:host::ng-deep .mrx-paginator .mrx-paginator__next.disabled .mrx-icon{color:var(--neutral-icon-disabled)}:host::ng-deep .mrx-paginator__text{font-size:16px;line-height:24px;color:var(--neutral-text-primary)}.mrx-paginator.mrx-paginator.paginator-centered{justify-content:center}.mrx-paginator.mrx-paginator.paginator-left{justify-content:flex-start}.mrx-paginator.mrx-paginator.paginator-right{justify-content:flex-end}\n"] }]
|
|
2546
2550
|
}], propDecorators: { pageSizes: [{
|
|
2547
2551
|
type: Input
|
|
2548
2552
|
}], currentPage: [{
|
|
@@ -2559,6 +2563,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
2559
2563
|
type: Input
|
|
2560
2564
|
}], paginatorText: [{
|
|
2561
2565
|
type: Input
|
|
2566
|
+
}], dropdownPosition: [{
|
|
2567
|
+
type: Input
|
|
2562
2568
|
}], setPosition: [{
|
|
2563
2569
|
type: Input,
|
|
2564
2570
|
args: ['position']
|
|
@@ -2963,7 +2969,7 @@ class TableComponent {
|
|
|
2963
2969
|
this.changeTypeTable.emit(type);
|
|
2964
2970
|
}
|
|
2965
2971
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2966
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableComponent, selector: "mrx-table", inputs: { type: "type", data: "data", pageSize: "pageSize", currentPage: "currentPage", total: "total", link: "link", isLoading: "isLoading", sort: "sort", trackById: "trackById", sortable: "sortable", striped: "striped", customClasses: "customClasses", emptyResultMsg: "emptyResultMsg", hovered: "hovered", autoHeight: "autoHeight", headerSettings: "headerSettings", contentSettings: "contentSettings", paginatorSettings: "paginatorSettings", setPageable: ["pageable", "setPageable"] }, outputs: { dataStateChanged: "dataStateChanged", downloadData: "downloadData", changeTypeTable: "changeTypeTable", change: "change" }, queries: [{ propertyName: "templateCard", first: true, predicate: ["templateCard"], descendants: true }, { propertyName: "emptyResultMsgTemplate", first: true, predicate: ["emptyResultMsgTemplate"], descendants: true }, { propertyName: "contentChildren", predicate: ColumnComponent }], ngImport: i0, template: "<div class=\"mrx-table\" [class]=\"getClasses\" [class.mb-3]=\"pageable\">\r\n <ng-container *ngIf=\"headerSettings\">\r\n <div\r\n class=\"mrx-table-card-header pt-2 pb-2 mb-3\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'default'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-md-6 mb-1 mb-md-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"counterTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-md-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n <div class=\"ml-4\" *ngIf=\"headerSettings.toggle\">\r\n <ng-container *ngTemplateOutlet=\"toggleTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"mrx-table-card-header mb-3 pt-2 pb-2\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'second'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-sm-6 mb-1 mb-sm-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-sm-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"downloadTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'default'\"\r\n [class.mrx-table__wrapper--substrate]=\"contentSettings.substrate\">\r\n <table\r\n [class.table-striped]=\"striped\"\r\n [class.table-solid]=\"!striped\"\r\n [class.mt-2]=\"contentSettings.substrate\"\r\n [class.mb-3]=\"contentSettings.substrate && data.length\"\r\n >\r\n <thead [class.table-head-gray]=\"!headerSettings || headerSettings.background\">\r\n <tr>\r\n <th *ngFor=\"let col of contentChildren; let index = index; let first = first; let last = last; trackBy: trackByFn\" [class]=\"col.customClasses\">\r\n <ng-container *ngIf=\"!col.templateHead; else headerItemTemplate\">\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <span>{{ col.label }}</span>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <div><span>{{ col.label }}</span></div>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #headerItemTemplate>\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col }\"></ng-container>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </ng-template>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <tr *ngFor=\"let dataItem of data; let index = index; let first = first; let last = last\" [class.-hovered]=\"hovered\">\r\n <td\r\n #tableTD\r\n class=\"p-0\"\r\n *ngFor=\"let col of contentChildren\"\r\n [class]=\"col.customClasses\"\r\n >\r\n <a\r\n class=\"link-wrapper td-content-wrapper\"\r\n [href]=\"getLinkForStroke(link, dataItem)\"\r\n *ngIf=\"link && col['isLink']; else defaultTemplate\"\r\n >\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </a>\r\n\r\n <ng-template #defaultTemplate>\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"td-content-wrapper p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <div class=\"td-content-wrapper h-100\">\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </ng-template>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <div class=\"mrx-table__result-message\" *ngIf=\"!data.length\">\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'cards'\">\r\n <ng-container *ngFor=\"let item of data; let index = index; let first = first; let last = last\">\r\n <ng-container *ngTemplateOutlet=\"templateCard; context: { $implicit: item, index, first, last }\"></ng-container>\r\n </ng-container>\r\n\r\n <div class=\"mrx-table__result-message--substrate\" *ngIf=\"!data.length\" >\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"mrx-table__paginator pt-2 pb-2\" [class.mrx-table__paginator--substrate]=\"paginatorSettings.substrate\" *ngIf=\"total\">\r\n <mrx-paginator\r\n *ngIf=\"pageable\"\r\n [total]=\"total\"\r\n [pageSize]=\"pageSize\"\r\n [position]=\"pageable.position\"\r\n [pageSizes]=\"pageable.pageSizes\"\r\n [currentPage]=\"currentPage\"\r\n [withPageSize]=\"pageable.withPageSize\"\r\n (dataStateChanged)=\"onDataStatePaginatorChanged($event)\">\r\n </mrx-paginator>\r\n</div>\r\n\r\n<ng-template #counterTemplate>\r\n <span class=\"d-flex align-items-center\" *ngIf=\"headerSettings?.count\">\r\n {{ total }} {{headerSettings?.countText || '\u043D\u043E\u0432\u043E\u0441\u0442\u0435\u0439'}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #sortTemplate>\r\n <div class=\"d-flex mrx-table-sort\" *ngIf=\"headerSettings?.sort\">\r\n <div class=\"mrx-table-sort-scale\" (click)=\"changeSort()\">\r\n <span class=\"mrx-table-sort-scale__title\">\u0421\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u043F\u043E:</span>\r\n <div class=\"mrx-table-sort-scale__icon\">\r\n <span *ngIf=\"sort?.dir === 'desc'\" class=\"mrx-icon icon-sorting-down icon-font-16\"></span>\r\n <span *ngIf=\"sort?.dir === 'asc'\" class=\"mrx-icon icon-sorting-up icon-font-16\"></span>\r\n </div>\r\n </div>\r\n <ng-select\r\n bindLabel=\"sortLabel\"\r\n bindValue=\"name\"\r\n [items]=\"colArray\"\r\n [ngModel]=\"selectedSort\"\r\n (change)=\"updateSortSelect($event)\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n [closeOnSelect]=\"true\"\r\n ></ng-select>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #downloadTemplate>\r\n <div class=\"mrx-table-download\" (click)=\"clickToDownload($event)\" *ngIf=\"headerSettings?.download\">\r\n <span class=\"desktop\">\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0434\u0430\u043D\u043D\u044B\u0435</span>\r\n <span class=\"mrx-icon icon-download icon-font-24\"></span>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #toggleTemplate>\r\n <div class=\"mrx-table-toggle\">\r\n <div class=\"mrx-table-toggle--item mr-1\" (click)=\"onChangeTypeTable('cards')\" [class.active]=\"type === 'cards'\">\r\n <span class=\"mrx-icon icon-cards-view icon-font-24\"></span>\r\n </div>\r\n <div class=\"mrx-table-toggle--item\" (click)=\"onChangeTypeTable('default')\" [class.active]=\"type === 'default'\">\r\n <span class=\"mrx-icon icon-table-view icon-font-24\"></span>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #emptyResultMsgTemplateDefault>\r\n {{emptyResultMsg}}\r\n</ng-template>\r\n", styles: [".mrx-table.mrx-table{display:block;width:100%}.mrx-table.mrx-table table td{height:1px}.mrx-table.mrx-table .th-wrapper{display:flex;cursor:pointer;word-break:inherit;justify-content:space-between;align-items:flex-end}.mrx-table.mrx-table .th-wrapper span{word-break:inherit}.mrx-table.mrx-table .mrx-table__sort-icon.asc path:last-child{fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table__sort-icon.desc path:first-child{fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table__wrapper.mrx-table__wrapper{overflow-x:auto;overflow-y:hidden;position:relative}.mrx-table__wrapper.mrx-table__wrapper .mrx-table__wrapper--substrate{padding-top:8px}.mrx-table.mrx-table.type-default table{width:100%;text-align:left;background-color:transparent;border-spacing:0}.mrx-table.mrx-table.type-default table thead.table-head-gray{background:var(--neutral-bg-island-default, #F8F9FA)}.mrx-table.mrx-table.type-default table thead .sort-asc .custom-table__sort path:nth-child(2){fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table thead .sort-desc .custom-table__sort path:nth-child(1){fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table td{max-width:340px;vertical-align:top}.mrx-table.mrx-table.type-default table td .link-wrapper{display:block;color:initial;height:100%}.mrx-table.mrx-table.type-default table td .link-wrapper:active{color:var(--neutral-text-primary, #262626)}.mrx-table.mrx-table.type-default table td .left-border{border-left:4px solid var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table td .light-border{border-left:4px solid transparent}.mrx-table.mrx-table.type-default table td .warning-back{background-color:#ffece7}.mrx-table.mrx-table.type-default table td .disabled-back{background-color:#fafafa}.mrx-table.mrx-table.type-default table td .link-colored,.mrx-table.mrx-table.type-default table td .link-colored:active{color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table th{padding:8px;vertical-align:bottom;word-break:inherit;font-weight:700}.mrx-table.mrx-table.type-default table th svg{margin-left:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-card-header{position:relative}.mrx-table.mrx-table .mrx-table-card-header--substrate{padding-left:24px;padding-right:24px;background:#fff;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table__wrapper--substrate{background:#fff;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table-toggle{display:flex}.mrx-table.mrx-table .mrx-table-toggle--item{display:flex;align-items:center;justify-content:center;cursor:pointer}.mrx-table.mrx-table .mrx-table-toggle--item .mrx-icon{color:#e5e5e5}.mrx-table.mrx-table .mrx-table-toggle--item.active .mrx-icon{color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-card,.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-table{justify-content:flex-start}.mrx-table.mrx-table .mrx-table-sort-scale{display:flex;align-items:center;margin-right:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-sort-scale__title{font-family:PT Sans;font-style:normal;font-weight:400;font-size:14px;line-height:143%;color:var(--neutral-text-primary, #262626);margin-right:12px}.mrx-table.mrx-table .mrx-table-sort-scale__icon{display:flex;align-items:center;justify-content:center}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select{max-width:215px;margin-bottom:0}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-select-container.ng-select-container{min-height:auto!important;border:none;cursor:pointer;align-items:center;height:100%!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-value-container.ng-value-container{padding-left:0!important;margin-right:8px}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-arrow-wrapper.ng-arrow-wrapper{min-height:auto;width:auto!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-dropdown-panel.ng-dropdown-panel{width:100vw;max-width:215px;left:auto;right:0}.mrx-table__paginator.mrx-table__paginator.mrx-table__paginator--substrate{padding-left:24px;padding-right:24px;background:#fff;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .table-striped tbody tr:nth-child(2n){background-color:var(--neutral-bg-island-default, #F8F9FA)}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n){transition:.2s}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n).-hovered:hover{background-color:var(--brand-bg-tertiary-hover, #edf5ff)}.mrx-table.mrx-table .table-solid{border-collapse:collapse}.mrx-table.mrx-table .table-solid thead tr{border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr:not(:last-child){border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr.-hovered:hover{box-shadow:0 1px 4px #3a3a3a4d}.mrx-table.mrx-table .mrx-table__wrapper .mrx-table__overlay{position:absolute;inset:0;background:#ffffffb3;display:flex;align-items:flex-start;justify-content:center;padding-top:12px;border-radius:4px}.mrx-table .mrx-table__result-message{display:flex;justify-content:center;width:100%;padding:var(--spacing-4);font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message *{font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message--substrate{display:flex;justify-content:center;width:100%;font-weight:400;font-size:16px;line-height:24px;color:var(--neutral-text-primary, #262626);padding:24px;background:#fff;box-shadow:0 1px 4px #3b43571a;border-radius:4px;position:relative}.mrx-table.mrx-table .mrx-table-download{display:flex;align-items:center;justify-content:flex-end;cursor:pointer}.mrx-table.mrx-table .mrx-table-download span{margin-right:8px;color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-download svg path{stroke:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-counter{font-family:var(--body-lg-font-family);font-size:var(--body-lg-font-size);font-weight:var(--body-lg-font-weight);line-height:var(--body-lg-line-height)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: PaginatorComponent, selector: "mrx-paginator", inputs: ["pageSizes", "currentPage", "pageSize", "total", "customClasses", "isEmptyPaginator", "isPaginatorText", "paginatorText", "position", "withPageSize"], outputs: ["dataStateChanged"] }, { kind: "component", type: i6.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }], animations: [
|
|
2972
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TableComponent, selector: "mrx-table", inputs: { type: "type", data: "data", pageSize: "pageSize", currentPage: "currentPage", total: "total", link: "link", isLoading: "isLoading", sort: "sort", trackById: "trackById", sortable: "sortable", striped: "striped", customClasses: "customClasses", emptyResultMsg: "emptyResultMsg", hovered: "hovered", autoHeight: "autoHeight", headerSettings: "headerSettings", contentSettings: "contentSettings", paginatorSettings: "paginatorSettings", setPageable: ["pageable", "setPageable"] }, outputs: { dataStateChanged: "dataStateChanged", downloadData: "downloadData", changeTypeTable: "changeTypeTable", change: "change" }, queries: [{ propertyName: "templateCard", first: true, predicate: ["templateCard"], descendants: true }, { propertyName: "emptyResultMsgTemplate", first: true, predicate: ["emptyResultMsgTemplate"], descendants: true }, { propertyName: "contentChildren", predicate: ColumnComponent }], ngImport: i0, template: "<div class=\"mrx-table\" [class]=\"getClasses\" [class.mb-3]=\"pageable\">\r\n <ng-container *ngIf=\"headerSettings\">\r\n <div\r\n class=\"mrx-table-card-header pt-2 pb-2 mb-3\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'default'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-md-6 mb-1 mb-md-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"counterTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-md-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n <div class=\"ml-4\" *ngIf=\"headerSettings.toggle\">\r\n <ng-container *ngTemplateOutlet=\"toggleTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"mrx-table-card-header mb-3 pt-2 pb-2\"\r\n [class.mrx-table-card-header--substrate]=\"headerSettings.substrate\"\r\n *ngIf=\"headerSettings.type === 'second'\"\r\n >\r\n <div class=\"row\">\r\n <div\r\n class=\"mrx-table-card-header--left col col-12 col-sm-6 mb-1 mb-sm-0 d-flex justify-content-start align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"sortTemplate\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table-card-header--right col col-12 col-sm-6 d-flex justify-content-end align-content-center\">\r\n <ng-container *ngTemplateOutlet=\"downloadTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container [ngSwitch]=\"type\">\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'default'\"\r\n [class.mrx-table__wrapper--substrate]=\"contentSettings.substrate\">\r\n <table\r\n [class.table-striped]=\"striped\"\r\n [class.table-solid]=\"!striped\"\r\n [class.mt-2]=\"contentSettings.substrate\"\r\n [class.mb-3]=\"contentSettings.substrate && data.length\"\r\n >\r\n <thead [class.table-head-gray]=\"!headerSettings || headerSettings.background\">\r\n <tr>\r\n <th *ngFor=\"let col of contentChildren; let index = index; let first = first; let last = last; trackBy: trackByFn\" [class]=\"col.customClasses\">\r\n <ng-container *ngIf=\"!col.templateHead; else headerItemTemplate\">\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <span>{{ col.label }}</span>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <div><span>{{ col.label }}</span></div>\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-template #headerItemTemplate>\r\n <ng-container *ngIf=\"col.sortable; else defaultHeadCol\">\r\n <div [class.th-wrapper]=\"sortable\" (click)=\"onSortColumn(col.name, col.sortable)\">\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col }\"></ng-container>\r\n <svg\r\n width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"\r\n [class]=\"columnSortedDir(col.name)\"\r\n class=\"mrx-table__sort-icon\">\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M4 9L8 13L12 9\" fill=\"#DAD5CE\"/>\r\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 7L8 3L4 7\" fill=\"#DAD5CE\"/>\r\n </svg>\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultHeadCol>\r\n <ng-container *ngTemplateOutlet=\"col.templateHead; context: { $implicit: col, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </ng-template>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <tr *ngFor=\"let dataItem of data; let index = index; let first = first; let last = last\" [class.-hovered]=\"hovered\">\r\n <td\r\n #tableTD\r\n class=\"p-0\"\r\n *ngFor=\"let col of contentChildren\"\r\n [class]=\"col.customClasses\"\r\n >\r\n <a\r\n class=\"link-wrapper td-content-wrapper\"\r\n [href]=\"getLinkForStroke(link, dataItem)\"\r\n *ngIf=\"link && col['isLink']; else defaultTemplate\"\r\n >\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </ng-template>\r\n </a>\r\n\r\n <ng-template #defaultTemplate>\r\n <ng-container *ngIf=\"!col.templateCell; else bodyItemTemplate\">\r\n <div class=\"td-content-wrapper p-2 h-100\">{{ dataItem[col.name] }}</div>\r\n </ng-container>\r\n\r\n <ng-template #bodyItemTemplate>\r\n <div class=\"td-content-wrapper h-100\">\r\n <ng-container\r\n *ngTemplateOutlet=\"col.templateCell; context: { $implicit: col, row: dataItem, index, first, last }\"></ng-container>\r\n </div>\r\n </ng-template>\r\n </ng-template>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <div class=\"mrx-table__result-message\" *ngIf=\"!data.length\">\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mrx-table__wrapper\" *ngSwitchCase=\"'cards'\">\r\n <ng-container *ngFor=\"let item of data; let index = index; let first = first; let last = last\">\r\n <ng-container *ngTemplateOutlet=\"templateCard; context: { $implicit: item, index, first, last }\"></ng-container>\r\n </ng-container>\r\n\r\n <div class=\"mrx-table__result-message--substrate\" *ngIf=\"!data.length\" >\r\n <ng-container *ngTemplateOutlet=\"emptyResultMsg ? emptyResultMsgTemplateDefault : emptyResultMsgTemplate\">\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-table__overlay\" [@visibleLoading]=\"isLoading ? 'in' : 'out'\" [ngClass]=\"{'open': isLoading}\" >\r\n <mrx-loader size=\"large\" color=\"brand\"></mrx-loader>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div class=\"mrx-table__paginator pt-2 pb-2\" [class.mrx-table__paginator--substrate]=\"paginatorSettings.substrate\" *ngIf=\"total\">\r\n <mrx-paginator\r\n *ngIf=\"pageable\"\r\n [total]=\"total\"\r\n [pageSize]=\"pageSize\"\r\n [position]=\"pageable.position\"\r\n [pageSizes]=\"pageable.pageSizes\"\r\n [currentPage]=\"currentPage\"\r\n [withPageSize]=\"pageable.withPageSize\"\r\n (dataStateChanged)=\"onDataStatePaginatorChanged($event)\">\r\n </mrx-paginator>\r\n</div>\r\n\r\n<ng-template #counterTemplate>\r\n <span class=\"d-flex align-items-center\" *ngIf=\"headerSettings?.count\">\r\n {{ total }} {{headerSettings?.countText || '\u043D\u043E\u0432\u043E\u0441\u0442\u0435\u0439'}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #sortTemplate>\r\n <div class=\"d-flex mrx-table-sort\" *ngIf=\"headerSettings?.sort\">\r\n <div class=\"mrx-table-sort-scale\" (click)=\"changeSort()\">\r\n <span class=\"mrx-table-sort-scale__title\">\u0421\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u0430\u0442\u044C \u043F\u043E:</span>\r\n <div class=\"mrx-table-sort-scale__icon\">\r\n <span *ngIf=\"sort?.dir === 'desc'\" class=\"mrx-icon icon-sorting-down icon-font-16\"></span>\r\n <span *ngIf=\"sort?.dir === 'asc'\" class=\"mrx-icon icon-sorting-up icon-font-16\"></span>\r\n </div>\r\n </div>\r\n <ng-select\r\n bindLabel=\"sortLabel\"\r\n bindValue=\"name\"\r\n [items]=\"colArray\"\r\n [ngModel]=\"selectedSort\"\r\n (change)=\"updateSortSelect($event)\"\r\n [clearable]=\"false\"\r\n [searchable]=\"false\"\r\n [closeOnSelect]=\"true\"\r\n ></ng-select>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #downloadTemplate>\r\n <div class=\"mrx-table-download\" (click)=\"clickToDownload($event)\" *ngIf=\"headerSettings?.download\">\r\n <span class=\"desktop\">\u0421\u043A\u0430\u0447\u0430\u0442\u044C \u0434\u0430\u043D\u043D\u044B\u0435</span>\r\n <span class=\"mrx-icon icon-download icon-font-24\"></span>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #toggleTemplate>\r\n <div class=\"mrx-table-toggle\">\r\n <div class=\"mrx-table-toggle--item mr-1\" (click)=\"onChangeTypeTable('cards')\" [class.active]=\"type === 'cards'\">\r\n <span class=\"mrx-icon icon-cards-view icon-font-24\"></span>\r\n </div>\r\n <div class=\"mrx-table-toggle--item\" (click)=\"onChangeTypeTable('default')\" [class.active]=\"type === 'default'\">\r\n <span class=\"mrx-icon icon-table-view icon-font-24\"></span>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #emptyResultMsgTemplateDefault>\r\n {{emptyResultMsg}}\r\n</ng-template>\r\n", styles: [".mrx-table.mrx-table{display:block;width:100%}.mrx-table.mrx-table table td{height:1px}.mrx-table.mrx-table .th-wrapper{display:flex;cursor:pointer;word-break:inherit;justify-content:space-between;align-items:flex-end}.mrx-table.mrx-table .th-wrapper span{word-break:inherit}.mrx-table.mrx-table .mrx-table__sort-icon.asc path:last-child{fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table__sort-icon.desc path:first-child{fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table__wrapper.mrx-table__wrapper{overflow-x:auto;overflow-y:hidden;position:relative}.mrx-table__wrapper.mrx-table__wrapper .mrx-table__wrapper--substrate{padding-top:8px}.mrx-table.mrx-table.type-default table{width:100%;text-align:left;background-color:transparent;border-spacing:0}.mrx-table.mrx-table.type-default table thead.table-head-gray{background:var(--neutral-bg-island-default, #F8F9FA)}.mrx-table.mrx-table.type-default table thead .sort-asc .custom-table__sort path:nth-child(2){fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table thead .sort-desc .custom-table__sort path:nth-child(1){fill:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table td{max-width:340px;vertical-align:top}.mrx-table.mrx-table.type-default table td .link-wrapper{display:block;color:initial;height:100%}.mrx-table.mrx-table.type-default table td .link-wrapper:active{color:var(--neutral-text-primary, #262626)}.mrx-table.mrx-table.type-default table td .left-border{border-left:4px solid var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table td .light-border{border-left:4px solid transparent}.mrx-table.mrx-table.type-default table td .warning-back{background-color:#ffece7}.mrx-table.mrx-table.type-default table td .disabled-back{background-color:#fafafa}.mrx-table.mrx-table.type-default table td .link-colored,.mrx-table.mrx-table.type-default table td .link-colored:active{color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table.type-default table th{padding:8px;vertical-align:bottom;word-break:inherit;font-weight:700}.mrx-table.mrx-table.type-default table th svg{margin-left:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-card-header{position:relative}.mrx-table.mrx-table .mrx-table-card-header--substrate{padding-left:24px;padding-right:24px;background:#fff;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table__wrapper--substrate{background:#fff;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .mrx-table-toggle{display:flex}.mrx-table.mrx-table .mrx-table-toggle--item{display:flex;align-items:center;justify-content:center;cursor:pointer}.mrx-table.mrx-table .mrx-table-toggle--item .mrx-icon{color:#e5e5e5}.mrx-table.mrx-table .mrx-table-toggle--item.active .mrx-icon{color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-card,.mrx-table.mrx-table .mrx-table-sort.mrx-table-sort--is-table{justify-content:flex-start}.mrx-table.mrx-table .mrx-table-sort-scale{display:flex;align-items:center;margin-right:8px;cursor:pointer}.mrx-table.mrx-table .mrx-table-sort-scale__title{font-family:PT Sans;font-style:normal;font-weight:400;font-size:14px;line-height:143%;color:var(--neutral-text-primary, #262626);margin-right:12px}.mrx-table.mrx-table .mrx-table-sort-scale__icon{display:flex;align-items:center;justify-content:center}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select{max-width:215px;margin-bottom:0}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-select-container.ng-select-container{min-height:auto!important;border:none;cursor:pointer;align-items:center;height:100%!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-value-container.ng-value-container{padding-left:0!important;margin-right:8px}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-arrow-wrapper.ng-arrow-wrapper{min-height:auto;width:auto!important}:host::ng-deep .mrx-table.mrx-table .mrx-table-sort .ng-select .ng-dropdown-panel.ng-dropdown-panel{width:100vw;max-width:215px;left:auto;right:0}.mrx-table__paginator.mrx-table__paginator.mrx-table__paginator--substrate{padding-left:24px;padding-right:24px;background:#fff;box-shadow:0 1px 4px #3b43571a;border-radius:4px}.mrx-table.mrx-table .table-striped tbody tr:nth-child(2n){background-color:var(--neutral-bg-island-default, #F8F9FA)}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n){transition:.2s}.mrx-table.mrx-table .table-striped tbody tr:nth-child(n).-hovered:hover{background-color:var(--brand-bg-tertiary-hover, #edf5ff)}.mrx-table.mrx-table .table-solid{border-collapse:collapse}.mrx-table.mrx-table .table-solid thead tr{border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr:not(:last-child){border-bottom:1px solid #f2f2f2}.mrx-table.mrx-table .table-solid tbody tr.-hovered:hover{box-shadow:0 1px 4px #3a3a3a4d}.mrx-table.mrx-table .mrx-table__wrapper .mrx-table__overlay{position:absolute;inset:0;background:#ffffffb3;display:flex;align-items:flex-start;justify-content:center;padding-top:12px;border-radius:4px}.mrx-table .mrx-table__result-message{display:flex;justify-content:center;width:100%;padding:var(--spacing-4);font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message *{font-family:var(--body-md-font-family);font-weight:var(--body-md-font-weight);font-size:var(--body-md-font-size);line-height:var(--body-md-line-height);color:var(--neutral-text-secondary)}.mrx-table .mrx-table__result-message--substrate{display:flex;justify-content:center;width:100%;font-weight:400;font-size:16px;line-height:24px;color:var(--neutral-text-primary, #262626);padding:24px;background:#fff;box-shadow:0 1px 4px #3b43571a;border-radius:4px;position:relative}.mrx-table.mrx-table .mrx-table-download{display:flex;align-items:center;justify-content:flex-end;cursor:pointer}.mrx-table.mrx-table .mrx-table-download span{margin-right:8px;color:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-download svg path{stroke:var(--brand-bg-primary-default, #2a6ab8)}.mrx-table.mrx-table .mrx-table-counter{font-family:var(--body-lg-font-family);font-size:var(--body-lg-font-size);font-weight:var(--body-lg-font-weight);line-height:var(--body-lg-line-height)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: PaginatorComponent, selector: "mrx-paginator", inputs: ["pageSizes", "currentPage", "pageSize", "total", "customClasses", "isEmptyPaginator", "isPaginatorText", "paginatorText", "dropdownPosition", "position", "withPageSize"], outputs: ["dataStateChanged"] }, { kind: "component", type: i6.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }], animations: [
|
|
2967
2973
|
trigger('visibleLoading', [
|
|
2968
2974
|
state('in', style({ opacity: 1, visibility: 'visible' })),
|
|
2969
2975
|
state('out', style({ opacity: 0, visibility: 'hidden' })),
|
|
@@ -16897,7 +16903,7 @@ class PdfViewerComponent {
|
|
|
16897
16903
|
this.handTool = !this.handTool;
|
|
16898
16904
|
}
|
|
16899
16905
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PdfViewerComponent, deps: [{ token: i1$8.NgxExtendedPdfViewerService }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
16900
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PdfViewerComponent, selector: "mrx-pdf-viewer", inputs: { showSidebarButton: "showSidebarButton", showHandToolButton: "showHandToolButton", handTool: "handTool", showFindbarButton: "showFindbarButton", showRotateButton: "showRotateButton", showPrintButton: "showPrintButton", showDownloadButton: "showDownloadButton", showExpandButton: "showExpandButton", defaultZoom: "defaultZoom", downloadFileName: "downloadFileName", src: "src" }, providers: [TooltipService], viewQueries: [{ propertyName: "pdfViewer", first: true, predicate: NgxExtendedPdfViewerComponent, descendants: true }, { propertyName: "findMenu", first: true, predicate: ["findMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #customToolbar>\r\n <div class=\"mrx-pdf-viewer__toolbar\" id=\"toolbarViewer\">\r\n <div class=\"d-flex\">\r\n <mrx-icon-button\r\n *ngIf=\"showSidebarButton\"\r\n [iconClass]=\"'icon-burger'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onSidebarViewClick()\"\r\n [ngClass]=\"{'mrx-icon-button--toggled': sidebarVisible}\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n [title]=\"'test'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n *ngIf=\"showFindbarButton\"\r\n [iconClass]=\"'icon-search'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onSearchClick()\"\r\n [customClasses]=\"'py-1 px-2 mrx-pdf-viewer__find-button'\"\r\n [ngClass]=\"{'mrx-icon-button--toggled': isSearchPanelVisible}\"\r\n ></mrx-icon-button>\r\n <div *ngIf=\"isSearchPanelVisible\" class=\"mrx-pdf-viewer__findbar\" #findMenu>\r\n <mrx-input-text\r\n [customClasses]=\"findState === 1 ? 'mrx-input-error' :''+'searchText'\"\r\n placeholder=\"\u041D\u0430\u0439\u0442\u0438 \u0432 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0435...\"\r\n [ngModel]=\"searchQuery\"\r\n (ngModelChange)=\"onSearch($event)\">\r\n </mrx-input-text>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-chevron-left'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'p-1'\"\r\n (mrxClick)=\"findPrevious()\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-chevron-right'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'p-1'\"\r\n (mrxClick)=\"findNext()\"\r\n ></mrx-icon-button>\r\n <div *ngIf=\"findState === 0 || findState === 2\" class=\"mrx-pdf-viewer__findbar-result\">\r\n {{currentFind}} \u0438\u0437 {{totalFound}} \u0441\u043E\u0432\u043F\u0430\u0434\u0435\u043D\u0438\u0439\r\n </div>\r\n <div *ngIf=\"findState === 1\" class=\"color-negative d-flex align-items-center\">\u0424\u0440\u0430\u0437\u0430 \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u0430</div>\r\n </div>\r\n <div class=\"mrx-pdf-viewer__toolbar--nav\">\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-in-the-end-left'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onPageChange(1)\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-chevron-left'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onPageChange(page - 1 || 1)\"\r\n ></mrx-icon-button>\r\n <mrx-input-number [size]=\"'small'\" [customClasses]=\"'wpx-56'\"\r\n [ngModel]=\"page\"\r\n [numberType]=\"'int'\"\r\n [minValue]=\"1\"\r\n [maxValue]=\"pageCount\"\r\n [isAutoCorrectingValue]=\"true\"\r\n (ngModelChange)=\"onPageChange($event)\"\r\n ></mrx-input-number>\r\n <span class=\"mx-1\">\u0438\u0437 {{pageCount}}</span>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-chevron-right'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onNextPage()\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-in-the-end-right'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onLastPage()\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"d-flex\">\r\n <mrx-icon-button\r\n (mrxClick)=\"zoomClick(false)\"\r\n [iconClass]=\"'icon-minus'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n (mrxClick)=\"zoomClick(true)\"\r\n [iconClass]=\"'icon-plus'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-input-select\r\n [size]=\"'medium'\"\r\n [customClasses]=\"'wpx-156'\"\r\n [items]=\"zoomOptions\"\r\n (ngModelChange)=\"onZoomLevelSelect($event)\"\r\n [ngModel]=\"selectedZoom\"\r\n [clearable]=\"false\">\r\n </mrx-input-select>\r\n </div>\r\n\r\n <div class=\"d-flex\">\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-fc-text'\"\r\n [size]=\"'medium'\"\r\n *ngIf=\"showHandToolButton\"\r\n [ngClass]=\"{'mrx-icon-button--toggled': !handTool}\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onHandToolClick()\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-reload'\"\r\n [size]=\"'medium'\"\r\n *ngIf=\"showRotateButton\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onRotate(1)\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-return'\"\r\n [size]=\"'medium'\"\r\n *ngIf=\"showRotateButton\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onRotate(-1)\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-arrow-expand'\"\r\n *ngIf=\"showExpandButton\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onExpandModeClick()\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-print'\"\r\n *ngIf=\"showPrintButton\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onPrintClick()\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n *ngIf=\"showDownloadButton\"\r\n [iconClass]=\"'icon-download'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onDownloadClick()\"\r\n ></mrx-icon-button>\r\n </div>\r\n\r\n </div>\r\n</ng-template>\r\n\r\n<ngx-extended-pdf-viewer\r\n #pdfViewer\r\n class=\"mrx-pdf-viewer\"\r\n [page]=\"page\"\r\n [sidebarVisible]=\"showSidebarButton && sidebarVisible\"\r\n (sidebarVisibleChange)=\"onSidebarVisibleChange($event)\"\r\n [customToolbar]=\"customToolbar\"\r\n [showSidebarButton]=\"true\"\r\n (pagesLoaded)=\"onPagesLoaded($event)\"\r\n [zoom]=\"selectedZoom.value\"\r\n (zoomChange)=\"onZoomChange($event)\"\r\n [textLayer]=\"true\"\r\n (pageChange)=\"onPageChange($event)\"\r\n [handTool]=\"handTool\"\r\n [rotation]=\"rotation\"\r\n (updateFindMatchesCount)=\"onUpdateMatchCase($event)\"\r\n (updateFindState)=\"onFindStateChanged($event)\"\r\n [src]=\"src\">\r\n</ngx-extended-pdf-viewer>\r\n", styles: [".mrx-pdf-viewer__toolbar{display:flex;padding:var(--spacing-1, 4px);justify-content:space-between;align-items:center;background:var(--neutral-bg-island-default, #F8F9FA);box-shadow:0 1px 4px #3b43571a;font-family:var(--body-sm-font-family, \"PT Sans\");font-size:var(--body-sm-font-size, 12px);font-style:normal;font-weight:var(--body-extra-sm-font-weight, 400);line-height:var(--body-lg-bold-font-size, 16px)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container{min-height:28px!important;min-width:var(--sizing-10);padding:2px;padding-left:var(--spacing-1);padding-right:var(--spacing-2)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container{padding-left:var(--spacing-1)!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container .ng-input{padding-left:var(--spacing-1)!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container .ng-value .ng-value-label{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-value .ng-value-label{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{min-height:var(--sizing-5);padding:calc(var(--spacing-1) / 2) var(--spacing-2)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-dropdown-panel .ng-dropdown-panel-items .ng-option span{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected:before{content:url(\"data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3336 4.6665L6.00032 11.9998L2.66699 8.66649' stroke='%23000' stroke-width='0.999998' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");right:var(--spacing-2)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-number.mrx-input-number.mrx-input-number-sm:not(.mrx-input-number-with-icon) input{padding:var(--spacing-1, 4px) var(--spacing-2, 8px)!important;min-height:28px;border:var(--border-width-default, 1px) solid var(--neutral-bg-stroke-default, #BFC5CC);text-align:right;font-size:var(--body-sm-font-size, 12px)!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon{color:var(--neutral-icon-default)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon.icon-font-20{font-size:20px!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon.icon-font-24{font-size:24px!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button{position:relative;max-width:36px;max-height:28px;box-sizing:border-box}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button:after{content:\"\";position:absolute;left:0;top:0;width:100%;height:100%;border-radius:var(--border-radius-1, 4px);border:1px solid transparent;transition:.2s}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button--toggled .mrx-icon-button{background:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button--toggled .mrx-icon-button:after{border-color:var(--brand-bg-primary-default, #2A6AB8)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button:active{background:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button:active:after{border-color:var(--brand-bg-primary-default, #2A6AB8)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button.icon-search.mrx-pdf-viewer__find-button{position:relative}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar .mrx-input-text.mrx-input-text-lg input{font-size:var(--body-sm-font-size, 12px)!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar mrx-input-text{width:100%}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar mrx-input-text .mrx-input-text{box-shadow:0 1px 4px #3a3a3a4d;border-radius:var(--border-radius-1)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar mrx-icon-button .mrx-icon-button{max-width:unset;max-height:unset}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar-result{display:flex;padding:6px var(--spacing-2, 8px);justify-content:center;align-items:center;gap:10px;border-radius:var(--sizing-1, 4px);background:var(--brand-bg-secondary-default, #EDF5FF);white-space:nowrap}.mrx-pdf-viewer__toolbar--nav{display:flex;align-items:center}.mrx-pdf-viewer__toolbar--nav span{color:var(--neutral-text-tertiary, #71767E)}.mrx-pdf-viewer__toolbar__find-button{position:relative}.mrx-pdf-viewer__findbar{position:absolute;top:47px;left:35px;z-index:100;background:#fff;width:auto;display:flex;padding:var(--spacing-2, 8px);border-radius:var(--sizing-1, 4px);box-shadow:0 1px 4px #3a3a3a4d;max-height:44px;box-sizing:border-box}.mrx-pdf-viewer__findbar:before{position:absolute;content:\"\";background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2224%22%20height%3D%2212%22%20viewBox%3D%220%200%2024%2012%22%20fill%3D%22none%22%3E%0A%3Cpath%20d%3D%22M24%2012H0L12%200L24%2012Z%22%20fill%3D%22white%22/%3E%0A%3C/svg%3E);background-repeat:no-repeat;top:-12px;left:12px;width:24px;height:12px}.mrx-pdf-viewer__findbar .searchText{position:absolute;top:20px}.mrx-pdf-viewer__findbar ::ng-deep .mrx-input-text.mrx-input-text{max-width:279px;min-width:279px}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar{background-color:var(--neutral-bg-island-default, #F8F9FA);padding:var(--spacing-1, 4px);height:28px!important;box-sizing:border-box;width:100%}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton{margin-top:0;margin-bottom:0;width:var(--sizing-6, 24px);max-width:var(--sizing-6, 24px);height:20px;padding:0;font-family:mrx-icon-font!important;color:var(--neutral-icon-default, #33373C);line-height:1;font-size:var(--body-lg-font-size, 16px);box-sizing:border-box;border-radius:var(--sizing-1, 4px);outline:none;border:1px solid transparent}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton:focus{border:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton:hover{background:var(--brand-bg-tertiary-hover, #edf5ff)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton.toggled{border:1px solid var(--brand-bg-primary-default, #2A6AB8);background:var(--brand-bg-secondary-default, #EDF5FF)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton svg{display:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton#viewThumbnail:after{content:\"\\e968\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton#viewOutline:after{content:\"\\ea1b\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton#viewLayers:after{content:\"\\e935\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-content #sidebarContent{top:28px!important;background-color:var(--neutral-bg-island-default, #F8F9FA)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView::-webkit-scrollbar,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView::-webkit-scrollbar,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView::-webkit-scrollbar{width:var(--sizing-2, 8px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView::-webkit-scrollbar-thumb,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView::-webkit-scrollbar-thumb,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView::-webkit-scrollbar-thumb{background:var(--neutral-bg-stroke-default, #BFC5CC);border-radius:var(--sizing-1, 4px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView::-webkit-scrollbar-thumb:hover,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView::-webkit-scrollbar-thumb:hover,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView::-webkit-scrollbar-thumb:hover{background:var(--neutral-bg-stroke-default, #BFC5CC)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView{padding:var(--spacing-3, 16px) var(--sizing-10, 40px);width:calc(100% - var(--sizing-20, 80px))}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView .thumbnail{margin:0;border:var(--spacing-1) solid rgba(0,0,0,0);border-radius:0}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView .thumbnail.selected{border:var(--spacing-1, 4px) solid var(--brand-bg-secondary-selected, #BED6F1)!important}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView{padding:var(--spacing-3, 16px);width:calc(100% - var(--spacing-6, 64px))}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem{outline:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem:focus,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem:focus,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem:hover,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem:hover{outline:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem>a,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem>a{color:var(--neutral-text-primary, #262626);font-size:var(--body-sm-font-size, 12px);line-height:var(--body-lg-bold-font-size, 16px);outline:none;border:none;padding:calc(var(--spacing-1, 4px) / 2) var(--spacing-1, 4px);min-width:calc(100% - var(--sizing-3, 12px))}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem>a:focus,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem>a:focus{outline:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem.selected>a,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem.selected>a{border-radius:var(--spacing-1, 4px);border:1px solid var(--brand-bg-primary-default, #2A6AB8)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem input[type=checkbox]:checked,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem input[type=checkbox]:checked{accent-color:var(--brand-bg-primary-default, #2A6AB8)!important}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItemToggler,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItemToggler{font-family:mrx-icon-font!important;color:var(--neutral-icon-default, 33373C);line-height:1;font-size:var(--body-lg-font-size, 16px);box-sizing:border-box;cursor:pointer}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItemToggler:before,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItemToggler:before{content:\"\\e926\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItemToggler.treeItemsHidden:before,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItemToggler.treeItemsHidden:before{content:\"\\e925\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer #viewerContainer::-webkit-scrollbar{width:var(--sizing-2, 8px);height:var(--sizing-2, 8px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer #viewerContainer::-webkit-scrollbar-thumb{background:var(--neutral-bg-stroke-default, #BFC5CC);border-radius:var(--sizing-1, 4px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer #viewerContainer::-webkit-scrollbar-thumb:hover{background:var(--neutral-bg-stroke-default, #BFC5CC)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .pdfViewer .page{border:none;box-shadow:0 1px 4px #3b43571a;margin-bottom:var(--spacing-2, 8px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .textLayer .highlight{background-color:var(--brand-bg-primary-default, #2A6AB8)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .textLayer .highlight.selected{background-color:var(--system-text-positive, #004A1A)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .textLayer ::selection{background:var(--brand-bg-secondary-hover, #bed6f1)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .dialogButton{color:var(--neutral-text-primary, #262626);font-size:var(--body-md-font-size, 14px);line-height:20px;background-color:var(--brand-bg-tertiary-default, #FFF);border:var(--brand-bg-tertiary-default, #FFF)!important}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog{box-shadow:0 1px 4px #3a3a3a4d;border:none;padding:var(--spacing-3, 16px);background:var(--brand-bg-tertiary-default, #FFF)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog::backdrop{background:var(--neutral-bg-modal, rgba(38, 38, 38, .25))}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog progress{border-radius:var(--sizing-1, 4px);width:120px;height:var(--sizing-1, 4px);vertical-align:middle}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog progress::-webkit-progress-bar{background-color:var(--neutral-bg-island-default, #F8F9FA);border-radius:var(--sizing-1, 4px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog progress::-webkit-progress-value{background-color:var(--brand-bg-primary-default, #2A6AB8);border-radius:var(--sizing-1, 4px)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$8.NgxExtendedPdfViewerComponent, selector: "ngx-extended-pdf-viewer", inputs: ["customFindbarInputArea", "customToolbar", "customFindbar", "customFindbarButtons", "customPdfViewer", "customSecondaryToolbar", "customSidebar", "customThumbnail", "customFreeFloatingBar", "showFreeFloatingBar", "enableDragAndDrop", "formData", "disableForms", "pageViewMode", "scrollMode", "authorization", "httpHeaders", "contextMenuAllowed", "enablePrint", "delayFirstView", "showTextEditor", "showStampEditor", "showDrawEditor", "logLevel", "relativeCoordsOptions", "minifiedJSLibraries", "printResolution", "rotation", "src", "base64Src", "minHeight", "height", "useBrowserLocale", "forceUsingLegacyES5", "backgroundColor", "filenameForDownload", "ignoreKeyboard", "ignoreKeys", "acceptKeys", "imageResourcesPath", "localeFolderPath", "language", "listenToURL", "nameddest", "password", "replaceBrowserPrint", "showUnverifiedSignatures", "startTabindex", "showSidebarButton", "sidebarVisible", "activeSidebarView", "findbarVisible", "propertiesDialogVisible", "showFindButton", "showFindHighlightAll", "showFindMatchCase", "showFindCurrentPageOnly", "showFindPageRange", "showFindEntireWord", "showFindEntirePhrase", "showFindMatchDiacritics", "showFindFuzzySearch", "showFindResultsCount", "showFindMessages", "showPagingButtons", "showZoomButtons", "showPresentationModeButton", "showOpenFileButton", "showPrintButton", "showDownloadButton", "theme", "showToolbar", "showSecondaryToolbarButton", "showSinglePageModeButton", "showVerticalScrollButton", "showHorizontalScrollButton", "showWrappedScrollButton", "showInfiniteScrollButton", "showBookModeButton", "showRotateButton", "handTool", "showHandToolButton", "showScrollingButton", "showSpreadButton", "showPropertiesButton", "showBorders", "spread", "page", "pageLabel", "textLayer", "zoom", "zoomLevels", "maxZoom", "minZoom", "mobileFriendlyZoom"], outputs: ["formDataChange", "pageViewModeChange", "progress", "srcChange", "scrollModeChange", "afterPrint", "beforePrint", "currentZoomFactor", "rotationChange", "annotationLayerRendered", "annotationEditorLayerRendered", "xfaLayerRendered", "outlineLoaded", "attachmentsloaded", "layersloaded", "sidebarVisibleChange", "activeSidebarViewChange", "findbarVisibleChange", "propertiesDialogVisibleChange", "handToolChange", "spreadChange", "thumbnailDrawn", "pageChange", "pageLabelChange", "pagesLoaded", "pageRender", "pageRendered", "pdfDownloaded", "pdfLoaded", "pdfLoadingStarts", "pdfLoadingFailed", "textLayerRendered", "annotationEditorModeChanged", "updateFindMatchesCount", "updateFindState", "zoomChange"] }, { kind: "component", type: IconButtonComponent, selector: "mrx-icon-button", inputs: ["size", "state", "type", "iconClass", "disabled", "tooltip", "tooltipPosition", "tooltipMaxWidth", "isActive", "customClasses"], outputs: ["mrxClick"] }, { kind: "component", type: InputSelectComponent, selector: "mrx-input-select", inputs: ["fields", "size", "selected", "bindValue", "bindLabel", "customClasses", "wrapperCustomClasses", "multiple", "loading", "addTag", "clearable", "items", "groupBy", "emptyValue", "virtualScroll", "trackByFn", "displayValue", "disabledFromDisplay", "maxLength", "customSearchFn", "isBottomLabel", "search", "required", "disabled", "readonly", "showEmptyFields", "placeholder", "searchable", "loadLabel", "notFoundText", "closeOnSelect", "multiCollapseCount", "invalid", "invalidMessage", "checkInvalid", "label", "labelRequiredHidden", "labelExtraClass", "tooltip", "tooltipHidden", "tooltipVisible", "maxSelectedItems"], outputs: ["changed", "modelChange", "searched"] }, { kind: "component", type: InputNumberComponent, selector: "mrx-input-number", inputs: ["fields", "placeholder", "innerClass", "customClasses", "required", "allowNegative", "size", "separator", "decimalSeparator", "isNullableValue", "isAutoCorrectingValue", "invalid", "checkInvalid", "numberType", "invalidMessage", "disabled", "readonly", "minValue", "maxValue"], outputs: ["modelChange"] }, { 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: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
|
|
16906
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PdfViewerComponent, selector: "mrx-pdf-viewer", inputs: { showSidebarButton: "showSidebarButton", showHandToolButton: "showHandToolButton", handTool: "handTool", showFindbarButton: "showFindbarButton", showRotateButton: "showRotateButton", showPrintButton: "showPrintButton", showDownloadButton: "showDownloadButton", showExpandButton: "showExpandButton", defaultZoom: "defaultZoom", downloadFileName: "downloadFileName", src: "src" }, providers: [TooltipService], viewQueries: [{ propertyName: "pdfViewer", first: true, predicate: NgxExtendedPdfViewerComponent, descendants: true }, { propertyName: "findMenu", first: true, predicate: ["findMenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #customToolbar>\r\n <div class=\"mrx-pdf-viewer__toolbar\" id=\"toolbarViewer\">\r\n <div class=\"d-flex\">\r\n <mrx-icon-button\r\n *ngIf=\"showSidebarButton\"\r\n [iconClass]=\"'icon-burger'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onSidebarViewClick()\"\r\n [ngClass]=\"{'mrx-icon-button--toggled': sidebarVisible}\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n [title]=\"'test'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n *ngIf=\"showFindbarButton\"\r\n [iconClass]=\"'icon-search'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onSearchClick()\"\r\n [customClasses]=\"'py-1 px-2 mrx-pdf-viewer__find-button'\"\r\n [ngClass]=\"{'mrx-icon-button--toggled': isSearchPanelVisible}\"\r\n ></mrx-icon-button>\r\n <div *ngIf=\"isSearchPanelVisible\" class=\"mrx-pdf-viewer__findbar\" #findMenu>\r\n <mrx-input-text\r\n [customClasses]=\"findState === 1 ? 'mrx-input-error' :''+'searchText'\"\r\n placeholder=\"\u041D\u0430\u0439\u0442\u0438 \u0432 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u0435...\"\r\n [ngModel]=\"searchQuery\"\r\n (ngModelChange)=\"onSearch($event)\">\r\n </mrx-input-text>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-chevron-left'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'p-1'\"\r\n (mrxClick)=\"findPrevious()\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-chevron-right'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'p-1'\"\r\n (mrxClick)=\"findNext()\"\r\n ></mrx-icon-button>\r\n <div *ngIf=\"findState === 0 || findState === 2\" class=\"mrx-pdf-viewer__findbar-result\">\r\n {{currentFind}} \u0438\u0437 {{totalFound}} \u0441\u043E\u0432\u043F\u0430\u0434\u0435\u043D\u0438\u0439\r\n </div>\r\n <div *ngIf=\"findState === 1\" class=\"color-negative d-flex align-items-center\">\u0424\u0440\u0430\u0437\u0430 \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u0430</div>\r\n </div>\r\n <div class=\"mrx-pdf-viewer__toolbar--nav\">\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-in-the-end-left'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onPageChange(1)\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-chevron-left'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onPageChange(page - 1 || 1)\"\r\n ></mrx-icon-button>\r\n <mrx-input-number [size]=\"'small'\" [customClasses]=\"'wpx-56'\"\r\n [ngModel]=\"page\"\r\n [numberType]=\"'int'\"\r\n [minValue]=\"1\"\r\n [maxValue]=\"pageCount\"\r\n [isAutoCorrectingValue]=\"true\"\r\n (ngModelChange)=\"onPageChange($event)\"\r\n ></mrx-input-number>\r\n <span class=\"mx-1\">\u0438\u0437 {{pageCount}}</span>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-chevron-right'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onNextPage()\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-in-the-end-right'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onLastPage()\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n </div>\r\n </div>\r\n\r\n <div class=\"d-flex\">\r\n <mrx-icon-button\r\n (mrxClick)=\"zoomClick(false)\"\r\n [iconClass]=\"'icon-minus'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n (mrxClick)=\"zoomClick(true)\"\r\n [iconClass]=\"'icon-plus'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-input-select\r\n [size]=\"'medium'\"\r\n [customClasses]=\"'wpx-156'\"\r\n [items]=\"zoomOptions\"\r\n (ngModelChange)=\"onZoomLevelSelect($event)\"\r\n [ngModel]=\"selectedZoom\"\r\n [clearable]=\"false\">\r\n </mrx-input-select>\r\n </div>\r\n\r\n <div class=\"d-flex\">\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-fc-text'\"\r\n [size]=\"'medium'\"\r\n *ngIf=\"showHandToolButton\"\r\n [ngClass]=\"{'mrx-icon-button--toggled': !handTool}\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onHandToolClick()\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-reload'\"\r\n [size]=\"'medium'\"\r\n *ngIf=\"showRotateButton\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onRotate(1)\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-return'\"\r\n [size]=\"'medium'\"\r\n *ngIf=\"showRotateButton\"\r\n [state]=\"'default'\"\r\n (mrxClick)=\"onRotate(-1)\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-arrow-expand'\"\r\n *ngIf=\"showExpandButton\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onExpandModeClick()\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n [iconClass]=\"'icon-print'\"\r\n *ngIf=\"showPrintButton\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onPrintClick()\"\r\n ></mrx-icon-button>\r\n <mrx-icon-button\r\n *ngIf=\"showDownloadButton\"\r\n [iconClass]=\"'icon-download'\"\r\n [size]=\"'medium'\"\r\n [state]=\"'default'\"\r\n [customClasses]=\"'py-1 px-2'\"\r\n (mrxClick)=\"onDownloadClick()\"\r\n ></mrx-icon-button>\r\n </div>\r\n\r\n </div>\r\n</ng-template>\r\n\r\n<ngx-extended-pdf-viewer\r\n #pdfViewer\r\n class=\"mrx-pdf-viewer\"\r\n [page]=\"page\"\r\n [sidebarVisible]=\"showSidebarButton && sidebarVisible\"\r\n (sidebarVisibleChange)=\"onSidebarVisibleChange($event)\"\r\n [customToolbar]=\"customToolbar\"\r\n [showSidebarButton]=\"true\"\r\n (pagesLoaded)=\"onPagesLoaded($event)\"\r\n [zoom]=\"selectedZoom.value\"\r\n (zoomChange)=\"onZoomChange($event)\"\r\n [textLayer]=\"true\"\r\n (pageChange)=\"onPageChange($event)\"\r\n [handTool]=\"handTool\"\r\n [rotation]=\"rotation\"\r\n (updateFindMatchesCount)=\"onUpdateMatchCase($event)\"\r\n (updateFindState)=\"onFindStateChanged($event)\"\r\n [src]=\"src\">\r\n</ngx-extended-pdf-viewer>\r\n", styles: [".mrx-pdf-viewer__toolbar{display:flex;padding:var(--spacing-1, 4px);justify-content:space-between;align-items:center;background:var(--neutral-bg-island-default, #F8F9FA);box-shadow:0 1px 4px #3b43571a;font-family:var(--body-sm-font-family, \"PT Sans\");font-size:var(--body-sm-font-size, 12px);font-style:normal;font-weight:var(--body-extra-sm-font-weight, 400);line-height:var(--body-lg-bold-font-size, 16px)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container{min-height:28px!important;min-width:var(--sizing-10);padding:2px;padding-left:var(--spacing-1);padding-right:var(--spacing-2)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container{padding-left:var(--spacing-1)!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container .ng-input{padding-left:var(--spacing-1)!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-select-container .ng-value-container .ng-value .ng-value-label{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-value .ng-value-label{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{min-height:var(--sizing-5);padding:calc(var(--spacing-1) / 2) var(--spacing-2)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-dropdown-panel .ng-dropdown-panel-items .ng-option span{font-size:var(--body-sm-font-size);line-height:var(--body-sm-line-height)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-select .ng-select.mrx-input-select-md .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected:before{content:url(\"data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3336 4.6665L6.00032 11.9998L2.66699 8.66649' stroke='%23000' stroke-width='0.999998' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A\");right:var(--spacing-2)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-input-number.mrx-input-number.mrx-input-number-sm:not(.mrx-input-number-with-icon) input{padding:var(--spacing-1, 4px) var(--spacing-2, 8px)!important;min-height:28px;border:var(--border-width-default, 1px) solid var(--neutral-bg-stroke-default, #BFC5CC);text-align:right;font-size:var(--body-sm-font-size, 12px)!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon{color:var(--neutral-icon-default)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon.icon-font-20{font-size:20px!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon.icon-font-24{font-size:24px!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button{position:relative;max-width:36px;max-height:28px;box-sizing:border-box}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button:after{content:\"\";position:absolute;left:0;top:0;width:100%;height:100%;border-radius:var(--border-radius-1, 4px);border:1px solid transparent;transition:.2s}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button--toggled .mrx-icon-button{background:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button--toggled .mrx-icon-button:after{border-color:var(--brand-bg-primary-default, #2A6AB8)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button:active{background:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button:active:after{border-color:var(--brand-bg-primary-default, #2A6AB8)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-icon-button.icon-search.mrx-pdf-viewer__find-button{position:relative}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar .mrx-input-text.mrx-input-text-lg input{font-size:var(--body-sm-font-size, 12px)!important}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar mrx-input-text{width:100%}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar mrx-input-text .mrx-input-text{box-shadow:0 1px 4px #3a3a3a4d;border-radius:var(--border-radius-1)}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar mrx-icon-button .mrx-icon-button{max-width:unset;max-height:unset}.mrx-pdf-viewer__toolbar ::ng-deep .mrx-pdf-viewer__findbar-result{display:flex;padding:6px var(--spacing-2, 8px);justify-content:center;align-items:center;gap:10px;border-radius:var(--sizing-1, 4px);background:var(--brand-bg-secondary-default, #EDF5FF);white-space:nowrap}.mrx-pdf-viewer__toolbar--nav{display:flex;align-items:center}.mrx-pdf-viewer__toolbar--nav span{color:var(--neutral-text-tertiary, #71767E)}.mrx-pdf-viewer__toolbar__find-button{position:relative}.mrx-pdf-viewer__findbar{position:absolute;top:47px;left:35px;z-index:100;background:#fff;width:auto;display:flex;padding:var(--spacing-2, 8px);border-radius:var(--sizing-1, 4px);box-shadow:0 1px 4px #3a3a3a4d;max-height:44px;box-sizing:border-box}.mrx-pdf-viewer__findbar:before{position:absolute;content:\"\";background-image:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2224%22%20height%3D%2212%22%20viewBox%3D%220%200%2024%2012%22%20fill%3D%22none%22%3E%0A%3Cpath%20d%3D%22M24%2012H0L12%200L24%2012Z%22%20fill%3D%22white%22/%3E%0A%3C/svg%3E);background-repeat:no-repeat;top:-12px;left:12px;width:24px;height:12px}.mrx-pdf-viewer__findbar .searchText{position:absolute;top:20px}.mrx-pdf-viewer__findbar ::ng-deep .mrx-input-text.mrx-input-text{max-width:279px;min-width:279px}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar{background-color:var(--neutral-bg-island-default, #F8F9FA);padding:var(--spacing-1, 4px);height:28px!important;box-sizing:border-box;width:100%}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton{margin-top:0;margin-bottom:0;width:var(--sizing-6, 24px);max-width:var(--sizing-6, 24px);height:20px;padding:0;font-family:mrx-icon-font!important;color:var(--neutral-icon-default, #33373C);line-height:1;font-size:var(--body-lg-font-size, 16px);box-sizing:border-box;border-radius:var(--sizing-1, 4px);outline:none;border:1px solid transparent}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton:focus{border:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton:hover{background:var(--brand-bg-tertiary-hover, #edf5ff)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton.toggled{border:1px solid var(--brand-bg-primary-default, #2A6AB8);background:var(--brand-bg-secondary-default, #EDF5FF)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton svg{display:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton#viewThumbnail:after{content:\"\\e968\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton#viewOutline:after{content:\"\\ea1b\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-toolbar #toolbarSidebar button.toolbarButton#viewLayers:after{content:\"\\e935\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer pdf-sidebar pdf-sidebar-content #sidebarContent{top:28px!important;background-color:var(--neutral-bg-island-default, #F8F9FA)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView::-webkit-scrollbar,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView::-webkit-scrollbar,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView::-webkit-scrollbar{width:var(--sizing-2, 8px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView::-webkit-scrollbar-thumb,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView::-webkit-scrollbar-thumb,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView::-webkit-scrollbar-thumb{background:var(--neutral-bg-stroke-default, #BFC5CC);border-radius:var(--sizing-1, 4px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView::-webkit-scrollbar-thumb:hover,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView::-webkit-scrollbar-thumb:hover,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView::-webkit-scrollbar-thumb:hover{background:var(--neutral-bg-stroke-default, #BFC5CC)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView{padding:var(--spacing-3, 16px) var(--sizing-10, 40px);width:calc(100% - var(--sizing-20, 80px))}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView .thumbnail{margin:0;border:var(--spacing-1) solid rgba(0,0,0,0);border-radius:0}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #thumbnailView .thumbnail.selected{border:var(--spacing-1, 4px) solid var(--brand-bg-secondary-selected, #BED6F1)!important}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView{padding:var(--spacing-3, 16px);width:calc(100% - var(--spacing-6, 64px))}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem{outline:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem:focus,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem:focus,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem:hover,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem:hover{outline:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem>a,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem>a{color:var(--neutral-text-primary, #262626);font-size:var(--body-sm-font-size, 12px);line-height:var(--body-lg-bold-font-size, 16px);outline:none;border:none;padding:calc(var(--spacing-1, 4px) / 2) var(--spacing-1, 4px);min-width:calc(100% - var(--sizing-3, 12px))}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem>a:focus,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem>a:focus{outline:none}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem.selected>a,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem.selected>a{border-radius:var(--spacing-1, 4px);border:1px solid var(--brand-bg-primary-default, #2A6AB8)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItem input[type=checkbox]:checked,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItem input[type=checkbox]:checked{accent-color:var(--brand-bg-primary-default, #2A6AB8)!important}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItemToggler,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItemToggler{font-family:mrx-icon-font!important;color:var(--neutral-icon-default, 33373C);line-height:1;font-size:var(--body-lg-font-size, 16px);box-sizing:border-box;cursor:pointer}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItemToggler:before,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItemToggler:before{content:\"\\e926\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #layersView .treeItemToggler.treeItemsHidden:before,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer.mrx-pdf-viewer .html #outlineView.treeWithDeepNesting .treeItemToggler.treeItemsHidden:before{content:\"\\e925\"}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer #viewerContainer::-webkit-scrollbar{width:var(--sizing-2, 8px);height:var(--sizing-2, 8px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer #viewerContainer::-webkit-scrollbar-thumb{background:var(--neutral-bg-stroke-default, #BFC5CC);border-radius:var(--sizing-1, 4px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer #viewerContainer::-webkit-scrollbar-thumb:hover{background:var(--neutral-bg-stroke-default, #BFC5CC)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .pdfViewer .page{border:none;box-shadow:0 1px 4px #3b43571a;margin-bottom:var(--spacing-2, 8px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .textLayer .highlight{background-color:var(--brand-bg-primary-default, #2A6AB8)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .textLayer .highlight.selected{background-color:var(--system-text-positive, #004A1A)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .textLayer ::selection{background:var(--brand-bg-secondary-hover, #bed6f1)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog,::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer .dialogButton{color:var(--neutral-text-primary, #262626);font-size:var(--body-md-font-size, 14px);line-height:20px;background-color:var(--brand-bg-tertiary-default, #FFF);border:var(--brand-bg-tertiary-default, #FFF)!important}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog{box-shadow:0 1px 4px #3a3a3a4d;border:none;padding:var(--spacing-3, 16px);background:var(--brand-bg-tertiary-default, #FFF)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog::backdrop{background:var(--neutral-bg-modal, rgba(38, 38, 38, .25))}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog progress{border-radius:var(--sizing-1, 4px);width:120px;height:var(--sizing-1, 4px);vertical-align:middle}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog progress::-webkit-progress-bar{background-color:var(--neutral-bg-island-default, #F8F9FA);border-radius:var(--sizing-1, 4px)}::ng-deep mrx-pdf-viewer ngx-extended-pdf-viewer dialog progress::-webkit-progress-value{background-color:var(--brand-bg-primary-default, #2A6AB8);border-radius:var(--sizing-1, 4px)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$8.NgxExtendedPdfViewerComponent, selector: "ngx-extended-pdf-viewer", inputs: ["customFindbarInputArea", "customToolbar", "customFindbar", "customFindbarButtons", "customPdfViewer", "customSecondaryToolbar", "customSidebar", "customThumbnail", "customFreeFloatingBar", "showFreeFloatingBar", "enableDragAndDrop", "formData", "disableForms", "pageViewMode", "scrollMode", "authorization", "httpHeaders", "contextMenuAllowed", "enablePrint", "delayFirstView", "showTextEditor", "showStampEditor", "showDrawEditor", "logLevel", "relativeCoordsOptions", "minifiedJSLibraries", "printResolution", "rotation", "src", "base64Src", "minHeight", "height", "useBrowserLocale", "forceUsingLegacyES5", "backgroundColor", "filenameForDownload", "ignoreKeyboard", "ignoreKeys", "acceptKeys", "imageResourcesPath", "localeFolderPath", "language", "listenToURL", "nameddest", "password", "replaceBrowserPrint", "showUnverifiedSignatures", "startTabindex", "showSidebarButton", "sidebarVisible", "activeSidebarView", "findbarVisible", "propertiesDialogVisible", "showFindButton", "showFindHighlightAll", "showFindMatchCase", "showFindCurrentPageOnly", "showFindPageRange", "showFindEntireWord", "showFindEntirePhrase", "showFindMatchDiacritics", "showFindFuzzySearch", "showFindResultsCount", "showFindMessages", "showPagingButtons", "showZoomButtons", "showPresentationModeButton", "showOpenFileButton", "showPrintButton", "showDownloadButton", "theme", "showToolbar", "showSecondaryToolbarButton", "showSinglePageModeButton", "showVerticalScrollButton", "showHorizontalScrollButton", "showWrappedScrollButton", "showInfiniteScrollButton", "showBookModeButton", "showRotateButton", "handTool", "showHandToolButton", "showScrollingButton", "showSpreadButton", "showPropertiesButton", "showBorders", "spread", "page", "pageLabel", "textLayer", "zoom", "zoomLevels", "maxZoom", "minZoom", "mobileFriendlyZoom"], outputs: ["formDataChange", "pageViewModeChange", "progress", "srcChange", "scrollModeChange", "afterPrint", "beforePrint", "currentZoomFactor", "rotationChange", "annotationLayerRendered", "annotationEditorLayerRendered", "xfaLayerRendered", "outlineLoaded", "attachmentsloaded", "layersloaded", "sidebarVisibleChange", "activeSidebarViewChange", "findbarVisibleChange", "propertiesDialogVisibleChange", "handToolChange", "spreadChange", "thumbnailDrawn", "pageChange", "pageLabelChange", "pagesLoaded", "pageRender", "pageRendered", "pdfDownloaded", "pdfLoaded", "pdfLoadingStarts", "pdfLoadingFailed", "textLayerRendered", "annotationEditorModeChanged", "updateFindMatchesCount", "updateFindState", "zoomChange"] }, { kind: "component", type: IconButtonComponent, selector: "mrx-icon-button", inputs: ["size", "state", "type", "iconClass", "disabled", "tooltip", "tooltipPosition", "tooltipMaxWidth", "isActive", "customClasses"], outputs: ["mrxClick"] }, { kind: "component", type: InputSelectComponent, selector: "mrx-input-select", inputs: ["fields", "size", "selected", "bindValue", "bindLabel", "customClasses", "wrapperCustomClasses", "multiple", "loading", "addTag", "clearable", "items", "groupBy", "emptyValue", "virtualScroll", "trackByFn", "displayValue", "disabledFromDisplay", "maxLength", "customSearchFn", "isBottomLabel", "search", "required", "disabled", "readonly", "showEmptyFields", "placeholder", "searchable", "loadLabel", "notFoundText", "closeOnSelect", "multiCollapseCount", "dropdownPosition", "invalid", "invalidMessage", "checkInvalid", "label", "labelRequiredHidden", "labelExtraClass", "tooltip", "tooltipHidden", "tooltipVisible", "maxSelectedItems"], outputs: ["changed", "modelChange", "searched"] }, { kind: "component", type: InputNumberComponent, selector: "mrx-input-number", inputs: ["fields", "placeholder", "innerClass", "customClasses", "required", "allowNegative", "size", "separator", "decimalSeparator", "isNullableValue", "isAutoCorrectingValue", "invalid", "checkInvalid", "numberType", "invalidMessage", "disabled", "readonly", "minValue", "maxValue"], outputs: ["modelChange"] }, { 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: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
|
|
16901
16907
|
trigger('openClose', [
|
|
16902
16908
|
state('open', style({ height: '*', padding: '*', 'margin-bottom': '8px' })),
|
|
16903
16909
|
state('closed', style({ height: 0, padding: 0, 'margin-bottom': 0 })),
|