@vaadin/icon 23.1.0 → 23.2.0-dev.53560527d

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/icon",
-  "version": "23.1.0",
+  "version": "23.2.0-dev.53560527d",
   "publishConfig": {
     "access": "public"
   },
@@ -33,13 +33,13 @@
   ],
   "dependencies": {
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/component-base": "^23.1.0",
-    "@vaadin/vaadin-lumo-styles": "^23.1.0",
-    "@vaadin/vaadin-themable-mixin": "^23.1.0",
+    "@vaadin/component-base": "23.2.0-dev.53560527d",
+    "@vaadin/vaadin-lumo-styles": "23.2.0-dev.53560527d",
+    "@vaadin/vaadin-themable-mixin": "23.2.0-dev.53560527d",
     "lit": "^2.0.0"
   },
   "devDependencies": {
     "@vaadin/testing-helpers": "^0.3.2"
   },
-  "gitHead": "322bba42b83f908a78cd972b06acadc5da95a69d"
+  "gitHead": "6c5c18369b09e22e76365d8a8a5e4bbb220f969b"
 }

package/src/vaadin-icon.js

@@ -83,7 +83,7 @@ class Icon extends ThemableMixin(ElementMixin(PolymerElement)) {
         version="1.1"
         xmlns="http://www.w3.org/2000/svg"
         xmlns:xlink="http://www.w3.org/1999/xlink"
-        viewBox="[[__computeViewBox(size)]]"
+        viewBox="[[__computeViewBox(size, __viewBox)]]"
         preserveAspectRatio="xMidYMid meet"
         aria-hidden="true"
       ></svg>
@@ -128,6 +128,9 @@ class Icon extends ThemableMixin(ElementMixin(PolymerElement)) {
 
       /** @private */
       __svgElement: Object,
+
+      /** @private */
+      __viewBox: String,
     };
   }
 
@@ -181,7 +184,10 @@ class Icon extends ThemableMixin(ElementMixin(PolymerElement)) {
       this.__checkDeprecatedIcon(icon);
       const iconsetName = this.__getIconsetName(icon);
       const iconset = Iconset.getIconset(iconsetName);
-      const { svg, size } = iconset.applyIcon(icon);
+      const { svg, size, viewBox } = iconset.applyIcon(icon);
+      if (viewBox) {
+        this.__viewBox = viewBox;
+      }
       if (size !== this.size) {
         this.size = size;
       }
@@ -215,8 +221,8 @@ class Icon extends ThemableMixin(ElementMixin(PolymerElement)) {
   }
 
   /** @private */
-  __computeViewBox(size) {
-    return `0 0 ${size} ${size}`;
+  __computeViewBox(size, viewBox) {
+    return viewBox || `0 0 ${size} ${size}`;
   }
 }
 

package/src/vaadin-iconset.d.ts

@@ -35,7 +35,7 @@ declare class Iconset extends ElementMixin(HTMLElement) {
    * Produce SVGTemplateResult for the element matching `name` in this
    * iconset, or `undefined` if there is no matching element.
    */
-  applyIcon(name: string): { svg: IconSvgLiteral; size: number };
+  applyIcon(name: string): { svg: IconSvgLiteral; size: number; viewBox: string | null };
 }
 
 declare global {

package/src/vaadin-iconset.js

@@ -82,7 +82,12 @@ class Iconset extends ElementMixin(PolymerElement) {
     // Create the icon map on-demand, since the iconset itself has no discrete
     // signal to know when it's children are fully parsed
     this._icons = this._icons || this.__createIconMap();
-    return { svg: cloneSvgNode(this._icons[this.__getIconId(name)]), size: this.size };
+    const icon = this._icons[this.__getIconId(name)];
+    return {
+      svg: cloneSvgNode(icon),
+      size: this.size,
+      viewBox: icon ? icon.getAttribute('viewBox') : null,
+    };
   }
 
   /**