@codecademy/gamut-icons 8.0.2-alpha.daf06c.0 → 8.0.2-alpha.fa9cd1.0

package/dist/icons/regular/LockIcon.js

@@ -24,7 +24,6 @@ export var LockIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,31 +31,40 @@ export var LockIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'lock-1'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("rect", {
-      x: 3.75,
-      y: 9.75,
-      width: 16.5,
-      height: 13.5,
-      rx: 1.5,
-      ry: 1.5,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M6.75 9.75V6a5.25 5.25 0 0110.5 0v3.75M12 15v3",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'lock-1',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'lock-1'
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 3.75,
+        y: 9.75,
+        width: 16.5,
+        height: 13.5,
+        rx: 1.5,
+        ry: 1.5,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M6.75 9.75V6a5.25 5.25 0 0110.5 0v3.75M12 15v3",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#lock-1)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MaintenanceIcon.js

@@ -24,7 +24,6 @@ export var MaintenanceIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,35 +31,44 @@ export var MaintenanceIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'safety-helmet-mine'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M21 15.375v-1.5a9 9 0 00-18 0v1.5m5.25-12v7.5m7.5-7.5v7.5",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("circle", {
-      cx: 12,
-      cy: 13.875,
-      r: 2.25,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5,
-      d: "M16.5 15.375h6.75m-22.5 0H7.5m-3.75 3a2.774 2.774 0 011.5 2.25h13.5a2.774 2.774 0 011.5-2.25"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'safety-helmet-mine',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'safety-helmet-mine'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M21 15.375v-1.5a9 9 0 00-18 0v1.5m5.25-12v7.5m7.5-7.5v7.5",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 12,
+        cy: 13.875,
+        r: 2.25,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5,
+        d: "M16.5 15.375h6.75m-22.5 0H7.5m-3.75 3a2.774 2.774 0 011.5 2.25h13.5a2.774 2.774 0 011.5-2.25"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#safety-helmet-mine)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MapFingerIcon.js

@@ -24,7 +24,6 @@ export var MapFingerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 140 140",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,19 +31,28 @@ export var MapFingerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'travel-map-finger'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M74.334 135.613l-16.129-18.135a9.084 9.084 0 1113.58-12.07l11.3 12.705v-52.5a8.75 8.75 0 1117.5 0V105h8.75a26.25 26.25 0 0126.25 26.25v4.375m-120.325-.63a73.587 73.587 0 01-7.093-15.517m-3.39-15.855a75.25 75.25 0 01.199-17.068m3.884-15.75a72.817 72.817 0 017.683-15.243m10.29-12.552a73.646 73.646 0 0113.493-10.425m14.734-6.767a54.56 54.56 0 018.25-2.246M83.084 4.363l26.25 26.25m0-26.25l-26.25 26.25",
-      strokeWidth: 8.75,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'travel-map-finger',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'travel-map-finger'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M74.334 135.613l-16.129-18.135a9.084 9.084 0 1113.58-12.07l11.3 12.705v-52.5a8.75 8.75 0 1117.5 0V105h8.75a26.25 26.25 0 0126.25 26.25v4.375m-120.325-.63a73.587 73.587 0 01-7.093-15.517m-3.39-15.855a75.25 75.25 0 01.199-17.068m3.884-15.75a72.817 72.817 0 017.683-15.243m10.29-12.552a73.646 73.646 0 0113.493-10.425m14.734-6.767a54.56 54.56 0 018.25-2.246M83.084 4.363l26.25 26.25m0-26.25l-26.25 26.25",
+        strokeWidth: 8.75,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#travel-map-finger)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MapPinIcon.js

@@ -24,7 +24,6 @@ export var MapPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 140 140",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,23 +31,32 @@ export var MapPinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'maps-pin-1'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("g", {
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 8.75,
-      children: [/*#__PURE__*/_jsx("path", {
-        d: "M135.625 52.5V27.125a8.75 8.75 0 00-5.5-8.126l-35-14a8.75 8.75 0 00-6.5 0l-37.25 14.904a8.75 8.75 0 01-6.5 0L10.379 6.102a4.375 4.375 0 00-6.003 4.083v83.842a8.75 8.75 0 005.5 8.126l35 14a8.75 8.75 0 006.5 0l16.805-6.726m-20.056-88.9v96.25M91.875 4.375v43.75m17.5 41.995a2.188 2.188 0 012.188 2.187m-4.375 0a2.188 2.188 0 012.187-2.188m0 4.381a2.188 2.188 0 01-2.188-2.188m4.376-.005a2.188 2.188 0 01-2.188 2.187"
-      }), /*#__PURE__*/_jsx("path", {
-        d: "M109.375 66.057a26.25 26.25 0 0126.25 26.25c0 11.205-15.68 32.526-22.802 41.638a4.375 4.375 0 01-6.895 0c-7.123-9.106-22.803-30.432-22.803-41.638a26.25 26.25 0 0126.25-26.25z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'maps-pin-1',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'maps-pin-1'
+      }), /*#__PURE__*/_jsxs("g", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 8.75,
+        children: [/*#__PURE__*/_jsx("path", {
+          d: "M135.625 52.5V27.125a8.75 8.75 0 00-5.5-8.126l-35-14a8.75 8.75 0 00-6.5 0l-37.25 14.904a8.75 8.75 0 01-6.5 0L10.379 6.102a4.375 4.375 0 00-6.003 4.083v83.842a8.75 8.75 0 005.5 8.126l35 14a8.75 8.75 0 006.5 0l16.805-6.726m-20.056-88.9v96.25M91.875 4.375v43.75m17.5 41.995a2.188 2.188 0 012.188 2.187m-4.375 0a2.188 2.188 0 012.187-2.188m0 4.381a2.188 2.188 0 01-2.188-2.188m4.376-.005a2.188 2.188 0 01-2.188 2.187"
+        }), /*#__PURE__*/_jsx("path", {
+          d: "M109.375 66.057a26.25 26.25 0 0126.25 26.25c0 11.205-15.68 32.526-22.802 41.638a4.375 4.375 0 01-6.895 0c-7.123-9.106-22.803-30.432-22.803-41.638a26.25 26.25 0 0126.25-26.25z"
+        })]
       })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#maps-pin-1)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MarkerIcon.js

@@ -24,7 +24,6 @@ export var MarkerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,19 +31,28 @@ export var MarkerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'pin-location'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5,
-      d: "M.75 23.25h22.5m-3.75-15c0 4.142-7.5 10.5-7.5 10.5s-7.5-6.358-7.5-10.5a7.5 7.5 0 0115 0z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'pin-location',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'pin-location'
+      }), /*#__PURE__*/_jsx("path", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5,
+        d: "M.75 23.25h22.5m-3.75-15c0 4.142-7.5 10.5-7.5 10.5s-7.5-6.358-7.5-10.5a7.5 7.5 0 0115 0z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#pin-location)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MastercardIcon.js

@@ -24,7 +24,6 @@ export var MastercardIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,42 +31,51 @@ export var MastercardIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'mastercard'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M.504 3.5h23v17h-23z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M13.5 12a5 5 0 11-5-5 5 5 0 015 5z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M13.5 12a5 5 0 11-5-5 5 5 0 015 5z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M12.018 15.557A4.949 4.949 0 0015.5 17a5 5 0 100-10 4.945 4.945 0 00-3.486 1.444",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M12.5 11.9a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 000 .2.1.1 0 00.092-.056.073.073 0 00.008-.033V14a.1.1 0 00-.1-.1m0-4a.1.1 0 10.1.1v-.011a.073.073 0 00-.008-.033.1.1 0 00-.092-.056m-6-1a.1.1 0 10.1.1.1.1 0 00-.1-.1m4 0a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m-4-4a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m2-5a.1.1 0 10.1.1.1.1 0 00-.1-.1m0-2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 4a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m-4-4a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 00-.1.1.118.118 0 00.014.055.084.084 0 00.075.045H4.5a.1.1 0 100-.2m0-4h-.007a.083.083 0 00-.075.045A.118.118 0 004.4 10a.1.1 0 10.1-.1",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'mastercard',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'mastercard'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M.504 3.5h23v17h-23z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M13.5 12a5 5 0 11-5-5 5 5 0 015 5z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M13.5 12a5 5 0 11-5-5 5 5 0 015 5z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12.018 15.557A4.949 4.949 0 0015.5 17a5 5 0 100-10 4.945 4.945 0 00-3.486 1.444",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12.5 11.9a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 000 .2.1.1 0 00.092-.056.073.073 0 00.008-.033V14a.1.1 0 00-.1-.1m0-4a.1.1 0 10.1.1v-.011a.073.073 0 00-.008-.033.1.1 0 00-.092-.056m-6-1a.1.1 0 10.1.1.1.1 0 00-.1-.1m4 0a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m-4-4a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m2-5a.1.1 0 10.1.1.1.1 0 00-.1-.1m0-2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 4a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 10.1.1.1.1 0 00-.1-.1m-4-4a.1.1 0 10.1.1.1.1 0 00-.1-.1m0 2a.1.1 0 00-.1.1.118.118 0 00.014.055.084.084 0 00.075.045H4.5a.1.1 0 100-.2m0-4h-.007a.083.083 0 00-.075.045A.118.118 0 004.4 10a.1.1 0 10.1-.1",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#mastercard)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MediumIcon.js

@@ -24,7 +24,6 @@ export var MediumIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,14 +31,23 @@ export var MediumIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'Medium-new'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M23 0H1a1 1 0 00-1 1v22a1 1 0 001 1h22a1 1 0 001-1V1a1 1 0 00-1-1zm-2.64 5.85L19 7.08a.38.38 0 00-.14.36v9.48a.38.38 0 00.14.36l1.35 1.33v.27H14v-.27l1.16-1.36c.13-.13.13-.17.13-.36V10l-2.8 7.9-.3 1h-.79c-2.65-5.79-3.49-7.82-4.3-9.21v7l1.64 2v.27H4v-.27l1.6-2v-9L4.36 6.15v-.53h4.77l3.22 7.71L15 6.06a.75.75 0 01.79-.58h4.58z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'medium-new',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'Medium-new'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M23 0H1a1 1 0 00-1 1v22a1 1 0 001 1h22a1 1 0 001-1V1a1 1 0 00-1-1zm-2.64 5.85L19 7.08a.38.38 0 00-.14.36v9.48a.38.38 0 00.14.36l1.35 1.33v.27H14v-.27l1.16-1.36c.13-.13.13-.17.13-.36V10l-2.8 7.9-.3 1h-.79c-2.65-5.79-3.49-7.82-4.3-9.21v7l1.64 2v.27H4v-.27l1.6-2v-9L4.36 6.15v-.53h4.77l3.22 7.71L15 6.06a.75.75 0 01.79-.58h4.58z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#medium-new)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MegaphoneIcon.js

@@ -24,7 +24,6 @@ export var MegaphoneIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,23 +31,32 @@ export var MegaphoneIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'megaphone'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("g", {
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 1.5,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [/*#__PURE__*/_jsx("path", {
-        d: "M21.698 20.486L2.318 13.68A1.68 1.68 0 011.2 12.074v-1.816a1.68 1.68 0 011.118-1.594l19.38-6.816a.833.833 0 011.102.792v17.04a.833.833 0 01-1.102.806z"
-      }), /*#__PURE__*/_jsx("path", {
-        d: "M14.64 18A5.606 5.606 0 013.6 16.495a5.734 5.734 0 01.442-2.22M16.8 3.569v15.194"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'megaphone',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'megaphone'
+      }), /*#__PURE__*/_jsxs("g", {
+        fill: "none",
+        stroke: "#fff",
+        strokeWidth: 1.5,
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        children: [/*#__PURE__*/_jsx("path", {
+          d: "M21.698 20.486L2.318 13.68A1.68 1.68 0 011.2 12.074v-1.816a1.68 1.68 0 011.118-1.594l19.38-6.816a.833.833 0 011.102.792v17.04a.833.833 0 01-1.102.806z"
+        }), /*#__PURE__*/_jsx("path", {
+          d: "M14.64 18A5.606 5.606 0 013.6 16.495a5.734 5.734 0 01.442-2.22M16.8 3.569v15.194"
+        })]
       })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#megaphone)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MenuIcon.js

@@ -24,7 +24,6 @@ export var MenuIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,19 +31,28 @@ export var MenuIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'navigation-menu'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5,
-      d: "M2.25 18.003h19.5m-19.5-6h19.5m-19.5-6h19.5"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'navigation-menu',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'navigation-menu'
+      }), /*#__PURE__*/_jsx("path", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5,
+        d: "M2.25 18.003h19.5m-19.5-6h19.5m-19.5-6h19.5"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#navigation-menu)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/MinimizeIcon.js

@@ -24,7 +24,6 @@ export var MinimizeIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
-    fill: "currentColor",
     role: "img",
     "aria-hidden": "true",
     width: width,
@@ -32,19 +31,28 @@ export var MinimizeIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'shrink-2'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5,
-      d: "M23.25.748l-9 9m-4.5 11.25v-6.75H3m11.25-11.25v6.75H21m-11.25 4.5l-9 9"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'shrink-2',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'shrink-2'
+      }), /*#__PURE__*/_jsx("path", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5,
+        d: "M23.25.748l-9 9m-4.5 11.25v-6.75H3m11.25-11.25v6.75H21m-11.25 4.5l-9 9"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#shrink-2)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });