@morozeckiy/dd-lib 0.7.62 → 0.7.63

package/fesm2022/morozeckiy-dd-lib.mjs

@@ -2104,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
             }] } });
@@ -3806,126 +3926,6 @@ 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 ITab {
     constructor(body) {
         this.id = body.id;