@morozeckiy/dd-lib 0.7.55 → 0.7.63

package/fesm2022/morozeckiy-dd-lib.mjs

@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
 import { EventEmitter, Output, ViewChild, Input, Component, Injectable, InjectionToken, Inject, Pipe, Directive, HostListener, TemplateRef, ChangeDetectionStrategy, Injector, forwardRef, CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA, Optional, ElementRef, Host, SkipSelf, signal, input } from '@angular/core';
 import * as i1$4 from '@angular/forms';
 import { Validators, NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { BehaviorSubject, Subject, of, fromEvent, combineLatest } from 'rxjs';
+import { BehaviorSubject, Subject, throwError, of, fromEvent, combineLatest } from 'rxjs';
 import { format, parse, isAfter, isBefore } from 'date-fns';
 import * as i1 from '@angular/common/http';
 import { HttpErrorResponse, HttpHeaders, HttpParams } from '@angular/common/http';
@@ -312,13 +312,17 @@ class InterceptorsService {
     }
     /** перехватчик состояния запросов к api */
     intercept(req, next) {
+        // Пропускаем запросы к SVG
+        if (req.url.includes('.svg')) {
+            return next.handle(req);
+        }
         return next.handle(req).pipe(catchError(err => {
             if (err instanceof HttpErrorResponse) {
                 if (err.status >= 500) {
                     this.router.navigate(['tech-works']);
                 }
             }
-            throw err;
+            return throwError(() => err);
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: InterceptorsService, deps: [{ token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
@@ -2057,15 +2061,21 @@ class LibSvgIconComponent {
     ngOnInit() {
         if (this.width) {
             this.el.nativeElement.style.width = this.width;
-            // this.rdr.setStyle(this.svgIcon, 'width', 'inherit')
+            if (this.svgIcon) {
+                this.svgIcon.style.setProperty('width', this.width, 'inherit');
+            }
         }
         if (this.height) {
             this.el.nativeElement.style.height = this.height;
-            // this.rdr.setStyle(this.svgIcon, 'height', 'inherit')
+            if (this.svgIcon) {
+                this.svgIcon.style.setProperty('height', this.height, 'inherit');
+            }
         }
         if (this.color) {
             this.el.nativeElement.style.fill = this.color;
-            // this.rdr.setStyle(this.svgIcon, 'stroke', this.color, RendererStyleFlags2.Important)
+            if (this.svgIcon) {
+                this.svgIcon.style.setProperty('stroke', this.color, 'important');
+            }
         }
     }
     svgElementFromString(svgContent) {
@@ -2094,13 +2104,133 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
                 type: Input
             }] } });
 
+class LibSvgViewerComponent {
+    constructor(http, elementRef) {
+        this.http = http;
+        this.elementRef = elementRef;
+        this.path = 'assets/images/';
+        this.pack = 'svg'; // директория внутри path
+        this.icon = '';
+        this.width = '';
+        this.height = '';
+        this.color = '';
+        this.containerClass = '';
+        this.colorRules = [];
+    }
+    ngOnChanges(changes) {
+        this.loadSvg();
+    }
+    loadSvg() {
+        if (!this.path || !this.icon)
+            return;
+        this.http.get(`${this.path}${this.pack}/${this.icon}.svg`, { responseType: 'text' })
+            .pipe(catchError((error) => {
+            const errorMessage = error.message || 'Неизвестная ошибка';
+            const customError = new HttpErrorResponse({
+                error: `SVG не найден: ${errorMessage}`,
+                status: 404,
+                statusText: 'Not Found'
+            });
+            console.error(`Ошибка загрузки SVG: ${errorMessage}`, {
+                path: `${this.path}${this.pack}/${this.icon}.svg`,
+                status: error.status
+            });
+            return throwError(() => customError);
+        }))
+            .subscribe({
+            next: (svg) => {
+                this.renderSvg(svg);
+            }
+        });
+    }
+    renderSvg(svgString) {
+        const container = this.elementRef.nativeElement.querySelector('.svg-container');
+        container.innerHTML = svgString;
+        const svg = container.querySelector('svg');
+        if (!svg)
+            return;
+        // Применяем параметры
+        if (this.width) {
+            svg.style.width = this.width;
+        }
+        if (this.height) {
+            svg.style.height = this.height;
+        }
+        this.applyColorRules(svg);
+        if (this.color) {
+            this.applyColor(svg);
+        }
+    }
+    applyColorRules(svg) {
+        this.colorRules.forEach(rule => {
+            const elements = svg.querySelectorAll(rule.selector);
+            elements.forEach(el => {
+                if (rule.attribute === 'fill' || rule.attribute === 'both') {
+                    el.setAttribute('fill', rule.color);
+                }
+                if (rule.attribute === 'stroke' || rule.attribute === 'both') {
+                    el.setAttribute('stroke', rule.color);
+                }
+                // Если атрибут не указан, меняем и fill и stroke
+                if (!rule.attribute) {
+                    if (el.hasAttribute('fill')) {
+                        el.setAttribute('fill', rule.color);
+                    }
+                    if (el.hasAttribute('stroke')) {
+                        el.setAttribute('stroke', rule.color);
+                    }
+                }
+            });
+        });
+    }
+    applyColor(svg) {
+        const elements = svg.querySelectorAll('[stroke], [fill]');
+        elements.forEach(el => {
+            // Обрабатываем stroke
+            if (el.hasAttribute('stroke') &&
+                el.getAttribute('stroke') !== 'none' &&
+                el.getAttribute('stroke') !== 'transparent') {
+                el.setAttribute('stroke', this.color);
+            }
+            // Обрабатываем fill
+            if (el.hasAttribute('fill') &&
+                el.getAttribute('fill') !== 'none' &&
+                el.getAttribute('fill') !== 'transparent') {
+                el.setAttribute('fill', this.color);
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: LibSvgViewerComponent, deps: [{ token: i1.HttpClient }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.2", type: LibSvgViewerComponent, isStandalone: true, selector: "dd-lib-svg-viewer", inputs: { path: "path", pack: "pack", icon: "icon", width: "width", height: "height", color: "color", containerClass: "containerClass", colorRules: "colorRules" }, usesOnChanges: true, ngImport: i0, template: `<div #svgContainer class="svg-container"></div>`, isInline: true, styles: [":host{display:block}svg{width:100%;height:100%;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: LibSvgViewerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'dd-lib-svg-viewer', imports: [], standalone: true, template: `<div #svgContainer class="svg-container"></div>`, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block}svg{width:100%;height:100%;display:block}\n"] }]
+        }], ctorParameters: () => [{ type: i1.HttpClient }, { type: i0.ElementRef }], propDecorators: { path: [{
+                type: Input
+            }], pack: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], height: [{
+                type: Input
+            }], color: [{
+                type: Input
+            }], containerClass: [{
+                type: Input
+            }], colorRules: [{
+                type: Input
+            }] } });
+
 class LibAccordionComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: LibAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: LibAccordionComponent, isStandalone: true, selector: "dd-lib-accordion", inputs: { accTitle: "accTitle" }, ngImport: i0, template: "<div class=\"accordion\">\r\n  <div (click)=\"showAccordionContent = !showAccordionContent\" class=\"accordion__header\">\r\n    @if (accTitle) {\r\n    <div [innerHTML]=\"accTitle\" class=\"accordion__title\"></div>\r\n    }\r\n    <div>\r\n      <dd-lib-svg-icon class=\"cup\" icon=\"{{ showAccordionContent ? 'minus' : 'plus' }}\"></dd-lib-svg-icon>\r\n    </div>\r\n  </div>\r\n  @if (showAccordionContent) {\r\n  <div class=\"mt-8\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".accordion__header{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.accordion__title{font-weight:500;font-size:20px;line-height:28px;color:var(--light-black-color)}@media screen and (max-width: 480px){.accordion__title{font-size:16px;line-height:24px}}\n"], dependencies: [{ kind: "component", type: LibSvgIconComponent, selector: "dd-lib-svg-icon", inputs: ["width", "height", "color", "icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.2", type: LibAccordionComponent, isStandalone: true, selector: "dd-lib-accordion", inputs: { accTitle: "accTitle" }, ngImport: i0, template: "<div class=\"accordion\">\r\n  <div (click)=\"showAccordionContent = !showAccordionContent\" class=\"accordion__header\">\r\n    @if (accTitle) {\r\n    <div [innerHTML]=\"accTitle\" class=\"accordion__title\"></div>\r\n    }\r\n    <div>\r\n      <dd-lib-svg-viewer class=\"cup\" icon=\"{{ showAccordionContent ? 'minus' : 'plus' }}\"></dd-lib-svg-viewer>\r\n    </div>\r\n  </div>\r\n  @if (showAccordionContent) {\r\n  <div class=\"mt-8\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".accordion__header{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.accordion__title{font-weight:500;font-size:20px;line-height:28px;color:var(--light-black-color)}@media screen and (max-width: 480px){.accordion__title{font-size:16px;line-height:24px}}\n"], dependencies: [{ kind: "component", type: LibSvgViewerComponent, selector: "dd-lib-svg-viewer", inputs: ["path", "pack", "icon", "width", "height", "color", "containerClass", "colorRules"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImport: i0, type: LibAccordionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dd-lib-accordion', standalone: true, imports: [LibSvgIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"accordion\">\r\n  <div (click)=\"showAccordionContent = !showAccordionContent\" class=\"accordion__header\">\r\n    @if (accTitle) {\r\n    <div [innerHTML]=\"accTitle\" class=\"accordion__title\"></div>\r\n    }\r\n    <div>\r\n      <dd-lib-svg-icon class=\"cup\" icon=\"{{ showAccordionContent ? 'minus' : 'plus' }}\"></dd-lib-svg-icon>\r\n    </div>\r\n  </div>\r\n  @if (showAccordionContent) {\r\n  <div class=\"mt-8\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".accordion__header{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.accordion__title{font-weight:500;font-size:20px;line-height:28px;color:var(--light-black-color)}@media screen and (max-width: 480px){.accordion__title{font-size:16px;line-height:24px}}\n"] }]
+            args: [{ selector: 'dd-lib-accordion', standalone: true, imports: [LibSvgIconComponent, LibSvgViewerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"accordion\">\r\n  <div (click)=\"showAccordionContent = !showAccordionContent\" class=\"accordion__header\">\r\n    @if (accTitle) {\r\n    <div [innerHTML]=\"accTitle\" class=\"accordion__title\"></div>\r\n    }\r\n    <div>\r\n      <dd-lib-svg-viewer class=\"cup\" icon=\"{{ showAccordionContent ? 'minus' : 'plus' }}\"></dd-lib-svg-viewer>\r\n    </div>\r\n  </div>\r\n  @if (showAccordionContent) {\r\n  <div class=\"mt-8\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".accordion__header{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.accordion__title{font-weight:500;font-size:20px;line-height:28px;color:var(--light-black-color)}@media screen and (max-width: 480px){.accordion__title{font-size:16px;line-height:24px}}\n"] }]
         }], propDecorators: { accTitle: [{
                 type: Input
             }] } });
@@ -3741,7 +3871,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.2", ngImpor
 
   Этот компонент значительно упрощает процесс отображения иконок на веб-странице, позволяя легко управлять их параметрами, такими как размеры и цвет.
 **/
-// @Deprecate
+/**
+ * @deprecated использовать lib-svg-viewer
+ */
 class LibSvgComponent {
     constructor(http, rdr) {
         this.http = http;
@@ -5137,5 +5269,5 @@ const t = true;
  * Generated bundle index. Do not edit.
  */
 
-export { API_URL, AutoHeightDirective, ClickOutsideDirective, CounterDirective, DDDialogRef, DEFAULT_FORMAT, DIALOG_CONFIG, DataEmptyComponent, DateService, Debounce, DeclensionDirective, DestroyService, DialogConfig, DialogService, DisableAfterNCall, Disabled, DropDownPositionDirective, ErrorPageComponent, FetcherService, FilterByKeyPipe, FilterPipe, FilterTabsPipe, FixedPositionDirective, FooterComponent, FooterLinkComponent, FooterLinksBlockComponent, HighlightPipe, ITab, InterceptorsService, LibAccordionComponent, LibBackButtonComponent, LibButtonComponent, LibCalendarComponent, LibCardComponent, LibCheckboxComponent, LibCommentInputComponent, LibCommonButtonComponent, LibCommonInputTextComponent, LibDateInputComponent, LibDateRangeComponent, LibDisclaimerComponent, LibFileLoaderComponent, LibFileUploadComponent, LibFilterButtonComponent, LibFilterComponent, LibHorizontalScrollComponent, LibImageLoaderComponent, LibInfoCardComponent, LibInputComponent, LibLoaderComponent, LibPeriodComponent, LibRadioComponent, LibSearchInputComponent, LibSelectComponent, LibSkeletonComponent, LibSortComponent, LibStepComponent, LibSvgComponent, LibSvgIconComponent, LibTabsFragmentComponent, LibTextareaComponent, ListKeyboardNavigationDirective, MainSharedComponent, ModalBaseComponent, ModalCommonComponent, NotFoundComponent, PhoneMaskDirective, ResizeTextareaDirective, ReversePipe, SafePipe, SelectableItemDirective, SvgIconsService, TOAST_CONFIG_TOKEN, TOOLTIP_DATA, TechWorksComponent, ThemeConfigurator, ThemeConstructorService, Throttle, ToastComponent, ToastConfig, ToastData, ToastRef, ToastService, ToastTypeData, TooltipComponent, TooltipDirective, TriangleDirective, ValidatorsService, completeIconSet, defaultToastConfig, provideToast, svgIconActogoneAccept, svgIconAll, svgIconAppgalery, svgIconAppstore, svgIconArrowDownRed, svgIconArrowUpGreen, svgIconBackArrow, svgIconBurger, svgIconCalendar, svgIconCheckGreen, svgIconCheckWhite, svgIconCircleNo, svgIconClear, svgIconClose, svgIconDangerT, svgIconDd, svgIconDdM, svgIconDobrodel, svgIconDownChevron, svgIconDownload, svgIconEds, svgIconEds2, svgIconEds2M, svgIconEdsM, svgIconEntry, svgIconErrorHint, svgIconEsia, svgIconEye, svgIconEyeOff, svgIconFile, svgIconFilter, svgIconGoogleapp, svgIconGrid, svgIconHealth, svgIconHealthM, svgIconInfoCircle, svgIconInfoT, svgIconLeftChevron, svgIconListSearch, svgIconLogout, svgIconMailExclamation, svgIconMaxFilter, svgIconMoon, svgIconMy, svgIconMyM, svgIconNews, svgIconNext, svgIconPaperclip, svgIconPenEdit, svgIconPguMo, svgIconPguMoM, svgIconPlug, svgIconPlugD, svgIconPlus, svgIconPreset, svgIconPrev, svgIconPrint, svgIconPrinter, svgIconQuestion, svgIconQuestionWhiteG, svgIconRedClose, svgIconReload, svgIconRightChevron, svgIconRustore, svgIconSearch, svgIconSend, svgIconSetAvatar, svgIconSharedLogo, svgIconSmallRoundLoader, svgIconSort, svgIconStar, svgIconSuccessT, svgIconSun, svgIconTg, svgIconToggleArrowLeft, svgIconToggleArrowRight, svgIconTrash, svgIconTrophy, svgIconUser, svgIconUserEmpty, svgIconUserEmptyD, svgIconVk, svgIconWarningT, t };
+export { API_URL, AutoHeightDirective, ClickOutsideDirective, CounterDirective, DDDialogRef, DEFAULT_FORMAT, DIALOG_CONFIG, DataEmptyComponent, DateService, Debounce, DeclensionDirective, DestroyService, DialogConfig, DialogService, DisableAfterNCall, Disabled, DropDownPositionDirective, ErrorPageComponent, FetcherService, FilterByKeyPipe, FilterPipe, FilterTabsPipe, FixedPositionDirective, FooterComponent, FooterLinkComponent, FooterLinksBlockComponent, HighlightPipe, ITab, InterceptorsService, LibAccordionComponent, LibBackButtonComponent, LibButtonComponent, LibCalendarComponent, LibCardComponent, LibCheckboxComponent, LibCommentInputComponent, LibCommonButtonComponent, LibCommonInputTextComponent, LibDateInputComponent, LibDateRangeComponent, LibDisclaimerComponent, LibFileLoaderComponent, LibFileUploadComponent, LibFilterButtonComponent, LibFilterComponent, LibHorizontalScrollComponent, LibImageLoaderComponent, LibInfoCardComponent, LibInputComponent, LibLoaderComponent, LibPeriodComponent, LibRadioComponent, LibSearchInputComponent, LibSelectComponent, LibSkeletonComponent, LibSortComponent, LibStepComponent, LibSvgComponent, LibSvgIconComponent, LibSvgViewerComponent, LibTabsFragmentComponent, LibTextareaComponent, ListKeyboardNavigationDirective, MainSharedComponent, ModalBaseComponent, ModalCommonComponent, NotFoundComponent, PhoneMaskDirective, ResizeTextareaDirective, ReversePipe, SafePipe, SelectableItemDirective, SvgIconsService, TOAST_CONFIG_TOKEN, TOOLTIP_DATA, TechWorksComponent, ThemeConfigurator, ThemeConstructorService, Throttle, ToastComponent, ToastConfig, ToastData, ToastRef, ToastService, ToastTypeData, TooltipComponent, TooltipDirective, TriangleDirective, ValidatorsService, completeIconSet, defaultToastConfig, provideToast, svgIconActogoneAccept, svgIconAll, svgIconAppgalery, svgIconAppstore, svgIconArrowDownRed, svgIconArrowUpGreen, svgIconBackArrow, svgIconBurger, svgIconCalendar, svgIconCheckGreen, svgIconCheckWhite, svgIconCircleNo, svgIconClear, svgIconClose, svgIconDangerT, svgIconDd, svgIconDdM, svgIconDobrodel, svgIconDownChevron, svgIconDownload, svgIconEds, svgIconEds2, svgIconEds2M, svgIconEdsM, svgIconEntry, svgIconErrorHint, svgIconEsia, svgIconEye, svgIconEyeOff, svgIconFile, svgIconFilter, svgIconGoogleapp, svgIconGrid, svgIconHealth, svgIconHealthM, svgIconInfoCircle, svgIconInfoT, svgIconLeftChevron, svgIconListSearch, svgIconLogout, svgIconMailExclamation, svgIconMaxFilter, svgIconMoon, svgIconMy, svgIconMyM, svgIconNews, svgIconNext, svgIconPaperclip, svgIconPenEdit, svgIconPguMo, svgIconPguMoM, svgIconPlug, svgIconPlugD, svgIconPlus, svgIconPreset, svgIconPrev, svgIconPrint, svgIconPrinter, svgIconQuestion, svgIconQuestionWhiteG, svgIconRedClose, svgIconReload, svgIconRightChevron, svgIconRustore, svgIconSearch, svgIconSend, svgIconSetAvatar, svgIconSharedLogo, svgIconSmallRoundLoader, svgIconSort, svgIconStar, svgIconSuccessT, svgIconSun, svgIconTg, svgIconToggleArrowLeft, svgIconToggleArrowRight, svgIconTrash, svgIconTrophy, svgIconUser, svgIconUserEmpty, svgIconUserEmptyD, svgIconVk, svgIconWarningT, t };
 //# sourceMappingURL=morozeckiy-dd-lib.mjs.map