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

package/dist/icons/regular/PieLineGraphIcon.js

@@ -24,7 +24,6 @@ export var PieLineGraphIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgR
   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,47 +31,56 @@ export var PieLineGraphIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgR
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'pie-line-graph'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M8.246 19.5l3.97-3.97a.75.75 0 011.061 0l1.939 1.939a.75.75 0 001.061 0l3.969-3.969",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("rect", {
-      x: 0.746,
-      y: 0.75,
-      width: 22.5,
-      height: 22.5,
-      rx: 1.5,
-      ry: 1.5,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("circle", {
-      cx: 8.246,
-      cy: 8.25,
-      r: 4.5,
-      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: "M8.246 3.75v4.5l3.182 3.182m5.068-6.182h3m-3 3h3"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'pie-line-graph',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'pie-line-graph'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M8.246 19.5l3.97-3.97a.75.75 0 011.061 0l1.939 1.939a.75.75 0 001.061 0l3.969-3.969",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 0.746,
+        y: 0.75,
+        width: 22.5,
+        height: 22.5,
+        rx: 1.5,
+        ry: 1.5,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 8.246,
+        cy: 8.25,
+        r: 4.5,
+        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: "M8.246 3.75v4.5l3.182 3.182m5.068-6.182h3m-3 3h3"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#pie-line-graph)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/PinIcon.js

@@ -24,7 +24,6 @@ export var PinIcon = /*#__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 PinIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'pin'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M4.949 8.783a1.5 1.5 0 00-.3 2.356l8.213 8.213a1.5 1.5 0 002.356-.3 7.522 7.522 0 00.81-5.54l6.529-4.155a1.5 1.5 0 00.256-2.326L16.97 1.188a1.5 1.5 0 00-2.326.255l-4.155 6.53a7.522 7.522 0 00-5.54.81zm3.804 6.463L.75 23.249",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'pin',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'pin'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M4.949 8.783a1.5 1.5 0 00-.3 2.356l8.213 8.213a1.5 1.5 0 002.356-.3 7.522 7.522 0 00.81-5.54l6.529-4.155a1.5 1.5 0 00.256-2.326L16.97 1.188a1.5 1.5 0 00-2.326.255l-4.155 6.53a7.522 7.522 0 00-5.54.81zm3.804 6.463L.75 23.249",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#pin)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/PlayCircledIcon.js

@@ -24,7 +24,6 @@ export var PlayCircledIcon = /*#__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,28 +31,37 @@ export var PlayCircledIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'button-play-1'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("circle", {
-      cx: 12,
-      cy: 11.998,
-      r: 11.25,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M9 15.613a1.636 1.636 0 002.712 1.231L17.25 12l-5.538-4.847A1.635 1.635 0 009 8.384z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'button-play-1',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'button-play-1'
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 12,
+        cy: 11.998,
+        r: 11.25,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M9 15.613a1.636 1.636 0 002.712 1.231L17.25 12l-5.538-4.847A1.635 1.635 0 009 8.384z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#button-play-1)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/PlayIcon.js

@@ -24,7 +24,6 @@ export var PlayIcon = /*#__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 PlayIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'controls-play'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M2.338 3.255v17.49a1.5 1.5 0 002.209 1.322l16.323-8.745a1.5 1.5 0 000-2.644L4.547 1.933a1.5 1.5 0 00-2.209 1.322z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'controls-play',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'controls-play'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M2.338 3.255v17.49a1.5 1.5 0 002.209 1.322l16.323-8.745a1.5 1.5 0 000-2.644L4.547 1.933a1.5 1.5 0 00-2.209 1.322z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#controls-play)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/PortfolioProjectIcon.js

@@ -24,7 +24,6 @@ export var PortfolioProjectIcon = /*#__PURE__*/React.forwardRef(function (_ref,
   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 PortfolioProjectIcon = /*#__PURE__*/React.forwardRef(function (_ref,
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'rating-star'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M12.729 1.2l3.346 6.629 6.44.638a.805.805 0 01.5 1.374l-5.3 5.253 1.965 7.138a.813.813 0 01-1.151.935L12 19.934l-6.52 3.229a.813.813 0 01-1.151-.935l1.965-7.138L.99 9.837a.805.805 0 01.5-1.374l6.44-.638L11.271 1.2a.819.819 0 011.458 0z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'rating-star',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'rating-star'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12.729 1.2l3.346 6.629 6.44.638a.805.805 0 01.5 1.374l-5.3 5.253 1.965 7.138a.813.813 0 01-1.151.935L12 19.934l-6.52 3.229a.813.813 0 01-1.151-.935l1.965-7.138L.99 9.837a.805.805 0 01.5-1.374l6.44-.638L11.271 1.2a.819.819 0 011.458 0z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#rating-star)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/ProgrammingBrowserIcon.js

@@ -24,7 +24,6 @@ export var ProgrammingBrowserIcon = /*#__PURE__*/React.forwardRef(function (_ref
   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 ProgrammingBrowserIcon = /*#__PURE__*/React.forwardRef(function (_ref
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'programming-browser-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: "M13.125 126.875a8.75 8.75 0 01-8.75-8.75v-95.58a9.45 9.45 0 019.42-9.42h112.456a9.403 9.403 0 019.374 9.374v94.955a9.45 9.45 0 01-9.42 9.421zm122.5-87.5H4.375m70 43.75h26.25"
-      }), /*#__PURE__*/_jsx("path", {
-        d: "M39.375 65.625l17.5 17.5-17.5 17.5"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'programming-browser-1',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'programming-browser-1'
+      }), /*#__PURE__*/_jsxs("g", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 8.75,
+        children: [/*#__PURE__*/_jsx("path", {
+          d: "M13.125 126.875a8.75 8.75 0 01-8.75-8.75v-95.58a9.45 9.45 0 019.42-9.42h112.456a9.403 9.403 0 019.374 9.374v94.955a9.45 9.45 0 01-9.42 9.421zm122.5-87.5H4.375m70 43.75h26.25"
+        }), /*#__PURE__*/_jsx("path", {
+          d: "M39.375 65.625l17.5 17.5-17.5 17.5"
+        })]
       })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#programming-browser-1)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/ProjectsIcon.js

@@ -24,7 +24,6 @@ export var ProjectsIcon = /*#__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 ProjectsIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'module-puzzle'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M19.5 15.75l3.311-3.311a1.5 1.5 0 000-2.121L20.7 8.212A3.75 3.75 0 1115.788 3.3l-2.106-2.111a1.5 1.5 0 00-2.121 0L8.25 4.5A3.75 3.75 0 104.5 8.25l-3.311 3.311a1.5 1.5 0 000 2.121L3.3 15.788A3.75 3.75 0 118.212 20.7l2.106 2.107a1.5 1.5 0 002.121 0L15.75 19.5a3.75 3.75 0 103.75-3.75z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'module-puzzle',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'module-puzzle'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M19.5 15.75l3.311-3.311a1.5 1.5 0 000-2.121L20.7 8.212A3.75 3.75 0 1115.788 3.3l-2.106-2.111a1.5 1.5 0 00-2.121 0L8.25 4.5A3.75 3.75 0 104.5 8.25l-3.311 3.311a1.5 1.5 0 000 2.121L3.3 15.788A3.75 3.75 0 118.212 20.7l2.106 2.107a1.5 1.5 0 002.121 0L15.75 19.5a3.75 3.75 0 103.75-3.75z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#module-puzzle)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/PythonIcon.js

@@ -24,7 +24,6 @@ export var PythonIcon = /*#__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,16 +31,25 @@ export var PythonIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'Python Icon'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M19.782 7.032h-2.815V4.217L14.75 2h-5.5L7.033 4.217v2.815H4.218L2 9.25v5.5l2.218 2.217h2.815v2.816L9.25 22h5.5l2.217-2.218v-2.815h2.816L22 14.75v-5.5l-2.218-2.217zM4.687 15.837l-1.555-1.554V9.718l1.556-1.555H12v-1.13H8.162V4.688l1.555-1.555h4.566l1.555 1.555v4.54l-2.188 2.207H9.88l-2.847 2.848v1.555H4.688zm16.18-1.554l-1.555 1.555H12v1.132h3.838v2.345l-1.555 1.555H9.718l-1.555-1.555V14.75l2.185-2.185h3.775l2.845-2.875V8.162h2.345l1.555 1.555v4.565z"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M9.547 4.453h1.133V5.71H9.548V4.453zM13.32 18.29h1.133v1.258H13.32V18.29z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'python-icon',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'Python Icon'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M19.782 7.032h-2.815V4.217L14.75 2h-5.5L7.033 4.217v2.815H4.218L2 9.25v5.5l2.218 2.217h2.815v2.816L9.25 22h5.5l2.217-2.218v-2.815h2.816L22 14.75v-5.5l-2.218-2.217zM4.687 15.837l-1.555-1.554V9.718l1.556-1.555H12v-1.13H8.162V4.688l1.555-1.555h4.566l1.555 1.555v4.54l-2.188 2.207H9.88l-2.847 2.848v1.555H4.688zm16.18-1.554l-1.555 1.555H12v1.132h3.838v2.345l-1.555 1.555H9.718l-1.555-1.555V14.75l2.185-2.185h3.775l2.845-2.875V8.162h2.345l1.555 1.555v4.565z"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M9.547 4.453h1.133V5.71H9.548V4.453zM13.32 18.29h1.133v1.258H13.32V18.29z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#python-icon)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/QuizIcon.js

@@ -24,7 +24,6 @@ export var QuizIcon = /*#__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,26 +31,35 @@ export var QuizIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'notes-paper-approve'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M13.629 23.25H2.25a1.5 1.5 0 01-1.5-1.5V2.25a1.5 1.5 0 011.5-1.5h19.5a1.5 1.5 0 011.5 1.5v11.379a1.5 1.5 0 01-.439 1.06l-8.122 8.122a1.5 1.5 0 01-1.06.439z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M14.25 23.115V15.75a1.5 1.5 0 011.5-1.5h7.365M15 5.25l-5.309 7.078a1.5 1.5 0 01-2.211.208L5.25 10.5",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'notes-paper-approve',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'notes-paper-approve'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M13.629 23.25H2.25a1.5 1.5 0 01-1.5-1.5V2.25a1.5 1.5 0 011.5-1.5h19.5a1.5 1.5 0 011.5 1.5v11.379a1.5 1.5 0 01-.439 1.06l-8.122 8.122a1.5 1.5 0 01-1.06.439z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M14.25 23.115V15.75a1.5 1.5 0 011.5-1.5h7.365M15 5.25l-5.309 7.078a1.5 1.5 0 01-2.211.208L5.25 10.5",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#notes-paper-approve)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/RadarIcon.js

@@ -24,7 +24,6 @@ export var RadarIcon = /*#__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,16 +31,25 @@ export var RadarIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'radar'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M12 24.005a11.922 11.922 0 01-8.481-3.511A11.917 11.917 0 010 12.01v-.023a11.927 11.927 0 013.511-8.464A11.925 11.925 0 0111.908.006a.586.586 0 01.186.001 11.947 11.947 0 017.84 2.999l.536-.536c.141-.142.33-.22.53-.22s.389.078.53.22c.142.141.22.33.22.53s-.078.389-.22.53l-7.72 7.72h9.439A.754.754 0 0124 12c.003 6.616-5.378 12.002-11.995 12.005H12zM1.529 12.75a10.454 10.454 0 003.05 6.683 10.45 10.45 0 006.671 3.043v-3.013a7.521 7.521 0 01-1.529-.316 7.455 7.455 0 01-4.386-3.708 7.548 7.548 0 01-.793-2.689H1.529zm11.221 9.725c5.186-.369 9.354-4.539 9.721-9.725h-3.008a7.55 7.55 0 01-.148.915.746.746 0 01-.897.566.744.744 0 01-.468-.331.742.742 0 01-.097-.566c.043-.192.077-.388.102-.585H12.75v5.207a5.945 5.945 0 002.006-.624.75.75 0 011.011.323.744.744 0 01.048.572.742.742 0 01-.371.438 7.448 7.448 0 01-2.694.801v3.009zM6.049 12.75a5.95 5.95 0 00.618 2.001 5.961 5.961 0 003.51 2.966c.351.112.71.192 1.073.238V12.75H6.049zm5.201-1.5V6.048a5.938 5.938 0 00-1.917.577.767.767 0 01-.333.077.751.751 0 01-.333-1.422 7.452 7.452 0 012.583-.741V1.534a10.451 10.451 0 00-6.678 3.05 10.455 10.455 0 00-3.043 6.666H4.54a7.455 7.455 0 01.387-1.75.752.752 0 01.957-.457.75.75 0 01.457.957 5.86 5.86 0 00-.292 1.25h5.201zm1.5-1.06l2.926-2.926a6.045 6.045 0 00-2.926-1.213v4.139zm0-5.648a7.524 7.524 0 013.993 1.655l2.128-2.128a10.472 10.472 0 00-6.121-2.534v3.007z"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M17.625 17.25a.796.796 0 01-.13-.011 1.126 1.126 0 01-.983-.983.796.796 0 010-.261c.06-.513.47-.923.983-.983a.699.699 0 01.261-.001c.513.06.923.47.983.983a.808.808 0 010 .262c-.06.513-.47.923-.983.983a.817.817 0 01-.131.011zm-11.25-9a.717.717 0 01-.131-.012 1.125 1.125 0 01-.982-.982.717.717 0 010-.262c.06-.513.47-.922.982-.982a.717.717 0 01.262 0c.513.06.922.47.982.982a.717.717 0 010 .262c-.06.513-.47.922-.982.982a.717.717 0 01-.131.012z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'radar',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'radar'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12 24.005a11.922 11.922 0 01-8.481-3.511A11.917 11.917 0 010 12.01v-.023a11.927 11.927 0 013.511-8.464A11.925 11.925 0 0111.908.006a.586.586 0 01.186.001 11.947 11.947 0 017.84 2.999l.536-.536c.141-.142.33-.22.53-.22s.389.078.53.22c.142.141.22.33.22.53s-.078.389-.22.53l-7.72 7.72h9.439A.754.754 0 0124 12c.003 6.616-5.378 12.002-11.995 12.005H12zM1.529 12.75a10.454 10.454 0 003.05 6.683 10.45 10.45 0 006.671 3.043v-3.013a7.521 7.521 0 01-1.529-.316 7.455 7.455 0 01-4.386-3.708 7.548 7.548 0 01-.793-2.689H1.529zm11.221 9.725c5.186-.369 9.354-4.539 9.721-9.725h-3.008a7.55 7.55 0 01-.148.915.746.746 0 01-.897.566.744.744 0 01-.468-.331.742.742 0 01-.097-.566c.043-.192.077-.388.102-.585H12.75v5.207a5.945 5.945 0 002.006-.624.75.75 0 011.011.323.744.744 0 01.048.572.742.742 0 01-.371.438 7.448 7.448 0 01-2.694.801v3.009zM6.049 12.75a5.95 5.95 0 00.618 2.001 5.961 5.961 0 003.51 2.966c.351.112.71.192 1.073.238V12.75H6.049zm5.201-1.5V6.048a5.938 5.938 0 00-1.917.577.767.767 0 01-.333.077.751.751 0 01-.333-1.422 7.452 7.452 0 012.583-.741V1.534a10.451 10.451 0 00-6.678 3.05 10.455 10.455 0 00-3.043 6.666H4.54a7.455 7.455 0 01.387-1.75.752.752 0 01.957-.457.75.75 0 01.457.957 5.86 5.86 0 00-.292 1.25h5.201zm1.5-1.06l2.926-2.926a6.045 6.045 0 00-2.926-1.213v4.139zm0-5.648a7.524 7.524 0 013.993 1.655l2.128-2.128a10.472 10.472 0 00-6.121-2.534v3.007z"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M17.625 17.25a.796.796 0 01-.13-.011 1.126 1.126 0 01-.983-.983.796.796 0 010-.261c.06-.513.47-.923.983-.983a.699.699 0 01.261-.001c.513.06.923.47.983.983a.808.808 0 010 .262c-.06.513-.47.923-.983.983a.817.817 0 01-.131.011zm-11.25-9a.717.717 0 01-.131-.012 1.125 1.125 0 01-.982-.982.717.717 0 010-.262c.06-.513.47-.922.982-.982a.717.717 0 01.262 0c.513.06.922.47.982.982a.717.717 0 010 .262c-.06.513-.47.922-.982.982a.717.717 0 01-.131.012z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#radar)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });

package/dist/icons/regular/RailsIcon.js

@@ -24,7 +24,6 @@ export var RailsIcon = /*#__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 RailsIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
-      id: titleId,
-      children: 'Rails Icon'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M9.196 11.888c-1.19 2.646-1.718 5.531-1.579 8.67h5.487c-.911-2.22-1.183-4.879-.834-7.955.266-2.346 1.3-4.336 3.065-5.966-2.972.959-4.998 2.713-6.139 5.25zm-2.781 9.974c-.363-3.821.173-7.326 1.607-10.514C10.1 6.724 14.727 4.43 21.899 4.47c-5.135 1.726-7.917 4.486-8.347 8.282-.43 3.796.143 6.832 1.72 9.11H6.415zM2 19.174h2.581v2.609H2zm1.108-7.014l2.022.736-.744 2.042-2.021-.735zM6.09 7.223l1.49.86-.87 1.506-1.489-.86zm4.775-2.826l.645 1.117-1.129.652-.645-1.117zM15.5 2.874l.343.94-.94.341-.342-.94zM20 3v1h-1V3z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: 'rails-icon',
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'Rails Icon'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M9.196 11.888c-1.19 2.646-1.718 5.531-1.579 8.67h5.487c-.911-2.22-1.183-4.879-.834-7.955.266-2.346 1.3-4.336 3.065-5.966-2.972.959-4.998 2.713-6.139 5.25zm-2.781 9.974c-.363-3.821.173-7.326 1.607-10.514C10.1 6.724 14.727 4.43 21.899 4.47c-5.135 1.726-7.917 4.486-8.347 8.282-.43 3.796.143 6.832 1.72 9.11H6.415zM2 19.174h2.581v2.609H2zm1.108-7.014l2.022.736-.744 2.042-2.021-.735zM6.09 7.223l1.49.86-.87 1.506-1.489-.86zm4.775-2.826l.645 1.117-1.129.652-.645-1.117zM15.5 2.874l.343.94-.94.341-.342-.94zM20 3v1h-1V3z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: 'url(#rails-icon)',
+      children: /*#__PURE__*/_jsx("rect", {
+        width: '24',
+        height: '24',
+        fill: 'red'
+      })
     })]
   }));
 });