@crowdfarming/oliva-ds 1.44.0 → 1.44.1

package/fesm2022/crowdfarming-oliva-ds.mjs

@@ -2362,12 +2362,13 @@ class IconComponent {
             return;
         }
         let svgString = this.icons[this.iconName];
-        // Set responsive dimensions - width and height to 100% for flexible scaling
-        // This ensures the icon scales properly within its container
+        // Set responsive dimensions - height to 100% for flexible scaling
+        // Width is handled by CSS (width: auto) to maintain natural aspect ratio
         // First, remove any existing width and height attributes
         svgString = svgString.replace(/(width|height)="[^"]*"/g, '');
-        // Then add width="100%" height="100%" to the SVG element
-        svgString = svgString.replace(/<svg([^>]*)>/, '<svg$1 width="100%" height="100%">');
+        // Then add height="100%" and preserveAspectRatio to the SVG element
+        // Width is controlled by CSS to allow flexible sizing
+        svgString = svgString.replace(/<svg([^>]*)>/, '<svg$1 height="100%" preserveAspectRatio="xMidYMid meet">');
         // Apply dynamic color styling if a color is specified
         if (this.iconColor) {
             // Create a CSS variable reference for the color
@@ -2387,11 +2388,11 @@ class IconComponent {
         this.iconSvg = this.sanitizer.bypassSecurityTrustHtml(svgString);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: IconComponent, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.7", type: IconComponent, isStandalone: true, selector: "lib-icon", inputs: { size: "size", icon: "icon", name: "name", color: "color" }, ngImport: i0, template: "<div\n  class=\"lib-icon\"\n  [ngClass]=\"size\"\n  [innerHTML]=\"iconSvg\"\n></div>\n", styles: [":host{display:contents}.lib-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;pointer-events:none}.lib-icon svg{width:100%;height:100%;min-width:0;min-height:0;display:block}.lib-icon.lg{height:1.5rem}.lib-icon.md{height:1.25rem}.lib-icon.sm{height:1rem}.lib-icon.xs{height:.875rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.7", type: IconComponent, isStandalone: true, selector: "lib-icon", inputs: { size: "size", icon: "icon", name: "name", color: "color" }, ngImport: i0, template: "<div\n  class=\"lib-icon\"\n  [ngClass]=\"size\"\n  [innerHTML]=\"iconSvg\"\n></div>\n", styles: [":host{display:contents}.lib-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;pointer-events:none}.lib-icon svg{width:auto;max-width:100%;min-width:0;min-height:0;display:block}.lib-icon.lg{height:1.5rem}.lib-icon.md{height:1.25rem}.lib-icon.sm{height:1rem}.lib-icon.xs{height:.875rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: IconComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-icon', imports: [CommonModule], template: "<div\n  class=\"lib-icon\"\n  [ngClass]=\"size\"\n  [innerHTML]=\"iconSvg\"\n></div>\n", styles: [":host{display:contents}.lib-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;pointer-events:none}.lib-icon svg{width:100%;height:100%;min-width:0;min-height:0;display:block}.lib-icon.lg{height:1.5rem}.lib-icon.md{height:1.25rem}.lib-icon.sm{height:1rem}.lib-icon.xs{height:.875rem}\n"] }]
+            args: [{ selector: 'lib-icon', imports: [CommonModule], template: "<div\n  class=\"lib-icon\"\n  [ngClass]=\"size\"\n  [innerHTML]=\"iconSvg\"\n></div>\n", styles: [":host{display:contents}.lib-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;pointer-events:none}.lib-icon svg{width:auto;max-width:100%;min-width:0;min-height:0;display:block}.lib-icon.lg{height:1.5rem}.lib-icon.md{height:1.25rem}.lib-icon.sm{height:1rem}.lib-icon.xs{height:.875rem}\n"] }]
         }], ctorParameters: () => [{ type: i1.DomSanitizer }], propDecorators: { size: [{
                 type: Input
             }], icon: [{