@codecademy/gamut-icons 8.1.1 → 8.1.2-alpha.b29ebf.0

package/dist/icons/regular/DiamondIcon.js

@@ -25,32 +25,42 @@ export var DiamondIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     strokeWidth: 1.5,
-    fill: "currentColor",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'diamond-icon'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M19.237 3.225a1.5 1.5 0 00-1.2-.6h-12a1.5 1.5 0 00-1.2.6L1.5 7.676a1.5 1.5 0 00.048 1.86l9.338 11.3a1.5 1.5 0 002.3 0l9.338-11.3a1.5 1.5 0 00.048-1.86zM5.349 2.792l6.688 18.583m6.687-18.583l-6.687 18.583M1.198 8.625h21.673",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M7.537 8.625l4.5-6 4.5 6",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "diamond-icon-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'diamond-icon'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M19.237 3.225a1.5 1.5 0 00-1.2-.6h-12a1.5 1.5 0 00-1.2.6L1.5 7.676a1.5 1.5 0 00.048 1.86l9.338 11.3a1.5 1.5 0 002.3 0l9.338-11.3a1.5 1.5 0 00.048-1.86zM5.349 2.792l6.688 18.583m6.687-18.583l-6.687 18.583M1.198 8.625h21.673",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M7.537 8.625l4.5-6 4.5 6",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#diamond-icon-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/DiscountStarPremiumFilledIcon.js

@@ -23,27 +23,37 @@ export var DiscountStarPremiumFilledIcon = /*#__PURE__*/React.forwardRef(functio
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     viewBox: "0 0 24 24",
-    fill: "currentColor",
+    fill: "#fff",
     xmlns: "http://www.w3.org/2000/svg",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'discount-star-premium-filled'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M12 0a12 12 0 1012 12A12.013 12.013 0 0012 0zm0 4.941A7.059 7.059 0 114.941 12 7.066 7.066 0 0112 4.941z",
-      fill: "currentColor"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M9.356 12.854l-.922 2.118a.886.886 0 00.223 1.023.903.903 0 001.064.119l2.287-1.288 2.289 1.288a.914.914 0 001.343-.594.885.885 0 00-.057-.548l-.92-2.118 1.664-1.638a.893.893 0 00.213-.974.87.87 0 00-.824-.536h-1.892l-1.001-2.15a.904.904 0 00-.813-.497.908.908 0 00-.815.495v.011l-.988 2.14H8.304a.871.871 0 00-.613 1.511l1.665 1.638z",
-      fill: "currentColor"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "discount-star-premium-filled-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'discount-star-premium-filled'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12 0a12 12 0 1012 12A12.013 12.013 0 0012 0zm0 4.941A7.059 7.059 0 114.941 12 7.066 7.066 0 0112 4.941z",
+        fill: "#fff"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M9.356 12.854l-.922 2.118a.886.886 0 00.223 1.023.903.903 0 001.064.119l2.287-1.288 2.289 1.288a.914.914 0 001.343-.594.885.885 0 00-.057-.548l-.92-2.118 1.664-1.638a.893.893 0 00.213-.974.87.87 0 00-.824-.536h-1.892l-1.001-2.15a.904.904 0 00-.813-.497.908.908 0 00-.815.495v.011l-.988 2.14H8.304a.871.871 0 00-.613 1.511l1.665 1.638z",
+        fill: "#fff"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#discount-star-premium-filled-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/DownloadIcon.js

@@ -24,27 +24,37 @@ export var DownloadIcon = /*#__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",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'download'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M12.001 3.75v12m-4.5-4.5l4.5 4.5 4.5-4.5m6.75 4.5v1.5a3 3 0 01-3 3h-16.5a3 3 0 01-3-3v-1.5",
-      stroke: "currentColor",
-      strokeWidth: 1.5,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      fill: "none"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "download-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'download'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12.001 3.75v12m-4.5-4.5l4.5 4.5 4.5-4.5m6.75 4.5v1.5a3 3 0 01-3 3h-16.5a3 3 0 01-3-3v-1.5",
+        stroke: "#fff",
+        strokeWidth: 1.5,
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        fill: "none"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#download-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/EarthIcon.js

@@ -24,9 +24,10 @@ export var EarthIcon = /*#__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",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
@@ -35,17 +36,29 @@ export var EarthIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     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: "M4.375 70a65.625 65.625 0 10131.25 0 65.625 65.625 0 10-131.25 0z"
-      }), /*#__PURE__*/_jsx("path", {
-        d: "M54.186 133.706C45.307 120.686 39.375 97.026 39.375 70s5.933-50.686 14.81-63.706M4.375 70h131.25M14.478 105h111.044M14.478 35h111.044M85.814 6.294c8.879 13.02 14.811 36.68 14.811 63.706s-5.932 50.686-14.81 63.706"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "earth-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'earth'
+      }), /*#__PURE__*/_jsxs("g", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 8.75,
+        children: [/*#__PURE__*/_jsx("path", {
+          d: "M4.375 70a65.625 65.625 0 10131.25 0 65.625 65.625 0 10-131.25 0z"
+        }), /*#__PURE__*/_jsx("path", {
+          d: "M54.186 133.706C45.307 120.686 39.375 97.026 39.375 70s5.933-50.686 14.81-63.706M4.375 70h131.25M14.478 105h111.044M14.478 35h111.044M85.814 6.294c8.879 13.02 14.811 36.68 14.811 63.706s-5.932 50.686-14.81 63.706"
+        })]
       })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#earth-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/EditIcon.js

@@ -24,34 +24,44 @@ export var EditIcon = /*#__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",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'pencil-2'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M22.192 1.814a3.631 3.631 0 00-5.157.035L2.57 16.31.75 23.25l6.942-1.819L22.157 6.97a3.628 3.628 0 00.035-5.156zm-5.571.449l5.122 5.12m-7.211-3.032l5.122 5.12",
-      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: "M2.57 16.31l3.59 1.532 1.536 3.584m9.397-14.515L6.16 17.841"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "pencil-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'pencil-2'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M22.192 1.814a3.631 3.631 0 00-5.157.035L2.57 16.31.75 23.25l6.942-1.819L22.157 6.97a3.628 3.628 0 00.035-5.156zm-5.571.449l5.122 5.12m-7.211-3.032l5.122 5.12",
+        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: "M2.57 16.31l3.59 1.532 1.536 3.584m9.397-14.515L6.16 17.841"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#pencil-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/EditorIcon.js

@@ -24,34 +24,44 @@ export var EditorIcon = /*#__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",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'programming-browser'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M2.25 21.75a1.5 1.5 0 01-1.5-1.5V3.865A1.62 1.62 0 012.365 2.25h19.278a1.612 1.612 0 011.607 1.607v16.278a1.62 1.62 0 01-1.615 1.615zm21-15H.75",
-      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 11.25l3 3-3 3m-9-6l-3 3 3 3m6-6l-3 6"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "programming-browser-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'programming-browser'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M2.25 21.75a1.5 1.5 0 01-1.5-1.5V3.865A1.62 1.62 0 012.365 2.25h19.278a1.612 1.612 0 011.607 1.607v16.278a1.62 1.62 0 01-1.615 1.615zm21-15H.75",
+        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 11.25l3 3-3 3m-9-6l-3 3 3 3m6-6l-3 6"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#programming-browser-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/EmailIcon.js

@@ -24,39 +24,49 @@ export var EmailIcon = /*#__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",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'email-action-unread'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("rect", {
-      x: 1.5,
-      y: 4.75,
-      width: 21,
-      height: 15,
-      rx: 1.5,
-      ry: 1.5,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M22.161 5.3l-8.144 6.264a3.308 3.308 0 01-4.034 0L1.839 5.3",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "email-action-unread-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'email-action-unread'
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 1.5,
+        y: 4.75,
+        width: 21,
+        height: 15,
+        rx: 1.5,
+        ry: 1.5,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M22.161 5.3l-8.144 6.264a3.308 3.308 0 01-4.034 0L1.839 5.3",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#email-action-unread-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/ExperienceIcon.js

@@ -24,9 +24,10 @@ export var ExperienceIcon = /*#__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",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
@@ -35,20 +36,32 @@ export var ExperienceIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef
     children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M13.533 16.35l7.545-.575a1.554 1.554 0 011.509 2.244 1.559 1.559 0 01-.845.76l-10.434 3.912a2.991 2.991 0 01-2 .037l-7.994-2.664",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M6.564 17.064h5.788a1.335 1.335 0 001.266-.912 1.335 1.335 0 00-.915-1.709l-5.938-1.619a4.512 4.512 0 00-1.924-.1l-3.527.588M8.73 2.966l-3.666 2.75 3.666 2.75m9.167-5.5l3.667 2.75-3.667 2.75M14.23 1.132l-1.833 9.167",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "experience-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'experience'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M13.533 16.35l7.545-.575a1.554 1.554 0 011.509 2.244 1.559 1.559 0 01-.845.76l-10.434 3.912a2.991 2.991 0 01-2 .037l-7.994-2.664",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M6.564 17.064h5.788a1.335 1.335 0 001.266-.912 1.335 1.335 0 00-.915-1.709l-5.938-1.619a4.512 4.512 0 00-1.924-.1l-3.527.588M8.73 2.966l-3.666 2.75 3.666 2.75m9.167-5.5l3.667 2.75-3.667 2.75M14.23 1.132l-1.833 9.167",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#experience-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/ExploreIcon.js

@@ -24,36 +24,46 @@ export var ExploreIcon = /*#__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",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'compass-1'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("circle", {
-      cx: 12,
-      cy: 12,
-      r: 11.25,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M16.648 7.352a.75.75 0 00-.768-.181L9.348 9.348 7.171 15.88a.75.75 0 00.949.949l6.532-2.177 2.177-6.532a.75.75 0 00-.181-.768zM12 .75V3m7.955 1.045l-1.591 1.591M23.25 12H21m-1.045 7.955l-1.591-1.591M12 23.25V21m-7.955-1.045l1.591-1.591M.75 12H3m1.045-7.955l1.591 1.591M12 11.625a.375.375 0 01.375.375m-.75 0a.375.375 0 01.375-.375m0 .75a.375.375 0 01-.375-.375m.75 0a.375.375 0 01-.375.375",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "compass-1-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'compass-1'
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 12,
+        cy: 12,
+        r: 11.25,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M16.648 7.352a.75.75 0 00-.768-.181L9.348 9.348 7.171 15.88a.75.75 0 00.949.949l6.532-2.177 2.177-6.532a.75.75 0 00-.181-.768zM12 .75V3m7.955 1.045l-1.591 1.591M23.25 12H21m-1.045 7.955l-1.591-1.591M12 23.25V21m-7.955-1.045l1.591-1.591M.75 12H3m1.045-7.955l1.591 1.591M12 11.625a.375.375 0 01.375.375m-.75 0a.375.375 0 01.375-.375m0 .75a.375.375 0 01-.375-.375m.75 0a.375.375 0 01-.375.375",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#compass-1-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/FacebookIcon.js

@@ -24,9 +24,10 @@ export var FacebookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 16 16",
-    fill: "currentColor",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
@@ -35,9 +36,21 @@ export var FacebookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      fill: "currentColor",
-      d: "M6.1 16V8.5h-2V5.8h2V3.5C6.1 1.7 7.3 0 10 0c1.1 0 1.9.1 1.9.1l-.1 2.5h-1.7C9.1 2.6 9 3 9 3.8v2h2.9l-.1 2.7H8.9V16H6.1z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "facebook-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'facebook'
+      }), /*#__PURE__*/_jsx("path", {
+        fill: "#fff",
+        d: "M6.1 16V8.5h-2V5.8h2V3.5C6.1 1.7 7.3 0 10 0c1.1 0 1.9.1 1.9.1l-.1 2.5h-1.7C9.1 2.6 9 3 9 3.8v2h2.9l-.1 2.7H8.9V16H6.1z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#facebook-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/FaviconIcon.js

@@ -24,22 +24,32 @@ export var FaviconIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     viewBox: "0 0 28 22",
     xmlns: "http://www.w3.org/2000/svg",
-    fill: "currentColor",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'Branding / Logo / Box / White'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M19.196.044s0 .022 0 0c.022.044.044.088.067.154v21.56c0 .066-.023.11-.045.132a.204.204 0 01-.157.066H.18c-.045 0-.09 0-.112-.022A.198.198 0 010 21.78V.176C0 .088.045.022.112 0h18.95c.044 0 .111.022.134.044zm-2.101 19.648V2.286c0-.088-.045-.154-.112-.176H2.235c-.067.022-.112.088-.112.176v17.406c0 .088.045.154.112.176h14.748c.067-.022.112-.088.112-.176zm10.704.176c.134 0 .201.066.201.198v1.736c0 .132-.09.198-.201.198h-6.525c-.134 0-.201-.088-.201-.198v-1.736c0-.132.089-.198.2-.198H27.8zM8.089 8.088c1.386 0 2.458.55 3.196 1.428.045.066.067.198-.022.264l-1.207 1.055c-.09.066-.201.044-.268-.044C9.34 10.286 8.849 10 8.089 10c-.826 0-1.452.396-1.72 1.165-.157.461-.201.989-.201 1.692s.044 1.253.2 1.714c.269.792.895 1.187 1.721 1.187.76 0 1.23-.285 1.699-.791.067-.088.178-.088.268-.022L11.263 16c.089.066.067.176.022.264-.738.857-1.81 1.406-3.196 1.406-1.854 0-3.262-.9-3.798-2.527C4.089 14.57 4 13.846 4 12.879c0-.967.09-1.692.29-2.264.537-1.626 1.945-2.527 3.8-2.527z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "branding-/-logo-/-box-/-white-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'Branding / Logo / Box / White'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M19.196.044s0 .022 0 0c.022.044.044.088.067.154v21.56c0 .066-.023.11-.045.132a.204.204 0 01-.157.066H.18c-.045 0-.09 0-.112-.022A.198.198 0 010 21.78V.176C0 .088.045.022.112 0h18.95c.044 0 .111.022.134.044zm-2.101 19.648V2.286c0-.088-.045-.154-.112-.176H2.235c-.067.022-.112.088-.112.176v17.406c0 .088.045.154.112.176h14.748c.067-.022.112-.088.112-.176zm10.704.176c.134 0 .201.066.201.198v1.736c0 .132-.09.198-.201.198h-6.525c-.134 0-.201-.088-.201-.198v-1.736c0-.132.089-.198.2-.198H27.8zM8.089 8.088c1.386 0 2.458.55 3.196 1.428.045.066.067.198-.022.264l-1.207 1.055c-.09.066-.201.044-.268-.044C9.34 10.286 8.849 10 8.089 10c-.826 0-1.452.396-1.72 1.165-.157.461-.201.989-.201 1.692s.044 1.253.2 1.714c.269.792.895 1.187 1.721 1.187.76 0 1.23-.285 1.699-.791.067-.088.178-.088.268-.022L11.263 16c.089.066.067.176.022.264-.738.857-1.81 1.406-3.196 1.406-1.854 0-3.262-.9-3.798-2.527C4.089 14.57 4 13.846 4 12.879c0-.967.09-1.692.29-2.264.537-1.626 1.945-2.527 3.8-2.527z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#branding-/-logo-/-box-/-white-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });