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

package/dist/icons/regular/IntersectionIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var IntersectionIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,50 +22,61 @@ export var IntersectionIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgR
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('IntersectionIcon');
   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: 'color-palette'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("circle", {
-      cx: 12,
-      cy: 8.25,
-      r: 6.75,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("circle", {
-      cx: 7.5,
-      cy: 15.75,
-      r: 6.75,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("circle", {
-      cx: 16.5,
-      cy: 15.75,
-      r: 6.75,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'color-palette'
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 12,
+        cy: 8.25,
+        r: 6.75,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 7.5,
+        cy: 15.75,
+        r: 6.75,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 16.5,
+        cy: 15.75,
+        r: 6.75,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/JavaIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var JavaIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,31 +22,42 @@ export var JavaIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('JavaIcon');
   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: 'Java Icon'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("g", {
-      stroke: "currentColor",
-      fill: "none",
-      children: [/*#__PURE__*/_jsx("path", {
-        d: "M5.954 18.842C4.14 19.114 3 19.507 3 19.943 3 20.763 7.03 22 12 22s7.875-1.3 9-2.057M8.306 18.002c-.423.118-.667.259-.667.409 0 .428 1.98.775 4.423.775 2.442 0 3.658-.415 4.422-.775M7.051 15.06c-.742.16-1.186.364-1.186.586 0 .514 2.377.93 5.31.93 2.932 0 4.545-.498 5.31-.93m-9.09-3.918c-.48.048-.92.106-1.31.174-1.11.193-1.797.461-1.797.757 0 .59 2.73 1.068 6.098 1.068s5.53-.549 6.098-1.068m2.656.211s.423-.61 1.269-.204c.845.407.685 1.832.14 2.443-.362.407-.879.95-1.549 1.628m-7.844-5.407c-1.01-.69-1.525-1.726-1.546-3.107-.031-2.071 2.728-2.693 3.122-3.936.263-.828.263-1.588 0-2.278"
-      }), /*#__PURE__*/_jsx("path", {
-        d: "M13.242 12.522c.197-.207 1.183-.622.394-1.865-.788-1.243-2.45-2.227-.676-3.47l1.38-1.035"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'Java Icon'
+      }), /*#__PURE__*/_jsxs("g", {
+        stroke: "#fff",
+        fill: "none",
+        children: [/*#__PURE__*/_jsx("path", {
+          d: "M5.954 18.842C4.14 19.114 3 19.507 3 19.943 3 20.763 7.03 22 12 22s7.875-1.3 9-2.057M8.306 18.002c-.423.118-.667.259-.667.409 0 .428 1.98.775 4.423.775 2.442 0 3.658-.415 4.422-.775M7.051 15.06c-.742.16-1.186.364-1.186.586 0 .514 2.377.93 5.31.93 2.932 0 4.545-.498 5.31-.93m-9.09-3.918c-.48.048-.92.106-1.31.174-1.11.193-1.797.461-1.797.757 0 .59 2.73 1.068 6.098 1.068s5.53-.549 6.098-1.068m2.656.211s.423-.61 1.269-.204c.845.407.685 1.832.14 2.443-.362.407-.879.95-1.549 1.628m-7.844-5.407c-1.01-.69-1.525-1.726-1.546-3.107-.031-2.071 2.728-2.693 3.122-3.936.263-.828.263-1.588 0-2.278"
+        }), /*#__PURE__*/_jsx("path", {
+          d: "M13.242 12.522c.197-.207 1.183-.622.394-1.865-.788-1.243-2.45-2.227-.676-3.47l1.38-1.035"
+        })]
       })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/JavascriptIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var JavascriptIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,27 +22,38 @@ export var JavascriptIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('JavascriptIcon');
   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: 'Javascript Icon'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M2 2v20h20V2H2zm18.8 18.8H3.2V3.2h17.6v17.6z"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M17.585 17.925a1.565 1.565 0 01-.488.25 2.297 2.297 0 01-2.457-.75 2.64 2.64 0 01-.143-.188l-.964.56c.23.366.54.676.905.908a3.475 3.475 0 001.562.52c.577.07 1.162.014 1.715-.163.54-.15 1-.503 1.285-.985.204-.39.29-.83.25-1.267a2.115 2.115 0 00-.813-1.652 6.085 6.085 0 00-1.382-.783l-.277-.125c-.25-.107-.5-.22-.75-.345a2.37 2.37 0 01-.535-.37 1.172 1.172 0 01-.313-1.105 1.11 1.11 0 01.795-.825c.28-.076.573-.076.853 0a1.5 1.5 0 01.87.62l.894-.575a2.23 2.23 0 00-1-.84 3.16 3.16 0 00-1.964-.127 2.063 2.063 0 00-1.378.975 2.18 2.18 0 00-.27 1.287c.017.572.265 1.114.688 1.5a4.62 4.62 0 001.262.768l.235.105c.338.15.688.305 1.028.47a2 2 0 01.5.362 1.165 1.165 0 01-.123 1.783l.015-.008zM8 19a3.21 3.21 0 002.315.082 1.857 1.857 0 001.25-1.25 3.46 3.46 0 00.16-1.152v-5.982h-1.2v5.96c0 .181-.013.362-.04.542-.028.37-.24.7-.562.882a1.5 1.5 0 01-1.518-.062 1.685 1.685 0 01-.5-.55l-.035-.055-.983.585c.253.445.643.797 1.113 1z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'Javascript Icon'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M2 2v20h20V2H2zm18.8 18.8H3.2V3.2h17.6v17.6z"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M17.585 17.925a1.565 1.565 0 01-.488.25 2.297 2.297 0 01-2.457-.75 2.64 2.64 0 01-.143-.188l-.964.56c.23.366.54.676.905.908a3.475 3.475 0 001.562.52c.577.07 1.162.014 1.715-.163.54-.15 1-.503 1.285-.985.204-.39.29-.83.25-1.267a2.115 2.115 0 00-.813-1.652 6.085 6.085 0 00-1.382-.783l-.277-.125c-.25-.107-.5-.22-.75-.345a2.37 2.37 0 01-.535-.37 1.172 1.172 0 01-.313-1.105 1.11 1.11 0 01.795-.825c.28-.076.573-.076.853 0a1.5 1.5 0 01.87.62l.894-.575a2.23 2.23 0 00-1-.84 3.16 3.16 0 00-1.964-.127 2.063 2.063 0 00-1.378.975 2.18 2.18 0 00-.27 1.287c.017.572.265 1.114.688 1.5a4.62 4.62 0 001.262.768l.235.105c.338.15.688.305 1.028.47a2 2 0 01.5.362 1.165 1.165 0 01-.123 1.783l.015-.008zM8 19a3.21 3.21 0 002.315.082 1.857 1.857 0 001.25-1.25 3.46 3.46 0 00.16-1.152v-5.982h-1.2v5.96c0 .181-.013.362-.04.542-.028.37-.24.7-.562.882a1.5 1.5 0 01-1.518-.062 1.685 1.685 0 01-.5-.55l-.035-.055-.983.585c.253.445.643.797 1.113 1z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/JiraIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var JiraIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var JiraIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('JiraIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
-    fill: "currentColor",
+    fill: "#fff",
     preserveAspectRatio: "xMidYMid",
     viewBox: "0 -30.632 255.324 285.956",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
@@ -35,12 +38,24 @@ export var JiraIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M244.658 0H121.707a55.502 55.502 0 0055.502 55.502h22.649V77.37c.02 30.625 24.841 55.447 55.466 55.467V10.666C255.324 4.777 250.55 0 244.658 0z"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M183.822 61.262H60.872c.019 30.625 24.84 55.447 55.466 55.467h22.649v21.938c.039 30.625 24.877 55.43 55.502 55.43V71.93c0-5.891-4.776-10.667-10.667-10.667z"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M122.951 122.489H0c0 30.653 24.85 55.502 55.502 55.502h22.72v21.867c.02 30.597 24.798 55.408 55.396 55.466V133.156c0-5.891-4.776-10.667-10.667-10.667z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'jira'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M244.658 0H121.707a55.502 55.502 0 0055.502 55.502h22.649V77.37c.02 30.625 24.841 55.447 55.466 55.467V10.666C255.324 4.777 250.55 0 244.658 0z"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M183.822 61.262H60.872c.019 30.625 24.84 55.447 55.466 55.467h22.649v21.938c.039 30.625 24.877 55.43 55.502 55.43V71.93c0-5.891-4.776-10.667-10.667-10.667z"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M122.951 122.489H0c0 30.653 24.85 55.502 55.502 55.502h22.72v21.867c.02 30.597 24.798 55.408 55.396 55.466V133.156c0-5.891-4.776-10.667-10.667-10.667z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/LearnIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LearnIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,37 +22,48 @@ export var LearnIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LearnIcon');
   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: 'file-code'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M22.5 21.753a1.5 1.5 0 01-1.5 1.5H3a1.5 1.5 0 01-1.5-1.5v-19.5A1.5 1.5 0 013 .753h15.045a1.5 1.5 0 011.048.427l2.955 2.882a1.5 1.5 0 01.452 1.074z",
-      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: "M14.295 9.003l3.75 3.75-3.75 3.75m-4.5-7.5l-3.75 3.75 3.75 3.75"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'file-code'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M22.5 21.753a1.5 1.5 0 01-1.5 1.5H3a1.5 1.5 0 01-1.5-1.5v-19.5A1.5 1.5 0 013 .753h15.045a1.5 1.5 0 011.048.427l2.955 2.882a1.5 1.5 0 01.452 1.074z",
+        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: "M14.295 9.003l3.75 3.75-3.75 3.75m-4.5-7.5l-3.75 3.75 3.75 3.75"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/LessonIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LessonIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,37 +22,48 @@ export var LessonIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LessonIcon');
   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: 'book-book-pages'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M16.5 21.513a1.5 1.5 0 01-1.9 1.446L4.1 20.042A1.5 1.5 0 013 18.6V2.487a1.5 1.5 0 011.9-1.446l10.5 3.391a1.5 1.5 0 011.1 1.445z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M4.5.987h15a1.5 1.5 0 011.5 1.5v15.75a1.5 1.5 0 01-1.5 1.5h-3",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'book-book-pages'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M16.5 21.513a1.5 1.5 0 01-1.9 1.446L4.1 20.042A1.5 1.5 0 013 18.6V2.487a1.5 1.5 0 011.9-1.446l10.5 3.391a1.5 1.5 0 011.1 1.445z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M4.5.987h15a1.5 1.5 0 011.5 1.5v15.75a1.5 1.5 0 01-1.5 1.5h-3",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/LevelIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LevelIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,15 +22,17 @@ export var LevelIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LevelIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0.25 0.25 13.5 13.5",
     style: {
       backgroundColor: 'transparent'
     },
-    fill: "currentColor",
+    fill: "#fff",
     role: "img",
     "aria-hidden": "true",
+    "pointer-events": "none",
     width: width,
     height: height,
     ref: svgRef,
@@ -38,13 +41,25 @@ export var LevelIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M4.975 7.45H1.15v5.4h3.825m4.05-8.1h-4.05v8.1h4.05m0-11.7h3.825v11.7H9.025z",
-      strokeWidth: 0.9,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'level'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M4.975 7.45H1.15v5.4h3.825m4.05-8.1h-4.05v8.1h4.05m0-11.7h3.825v11.7H9.025z",
+        strokeWidth: 0.9,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/LifePreserverIcon.js

@@ -8,6 +8,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
 import { Svg } from '../../props';
+import { useIconId } from '../../useIconId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export var LifePreserverIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,48 +22,59 @@ export var LifePreserverIcon = /*#__PURE__*/React.forwardRef(function (_ref, svg
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('LifePreserverIcon');
   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: 'help-wheel'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("circle", {
-      cx: 12,
-      cy: 12,
-      r: 3.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: "M17.119 20.301l-4.59-4.59m3.182-3.181l4.59 4.589m-16.602 0l4.59-4.59m3.182 3.183l-4.59 4.589m0-16.601l4.59 4.589m-3.182 3.182l-4.59-4.59m16.602 0l-4.59 4.59m-3.182-3.182l4.59-4.589"
-    }), /*#__PURE__*/_jsx("circle", {
-      cx: 12,
-      cy: 12,
-      r: 9.75,
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'help-wheel'
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 12,
+        cy: 12,
+        r: 3.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: "M17.119 20.301l-4.59-4.59m3.182-3.181l4.59 4.589m-16.602 0l4.59-4.59m3.182 3.183l-4.59 4.589m0-16.601l4.59 4.589m-3.182 3.182l-4.59-4.59m16.602 0l-4.59 4.59m-3.182-3.182l4.59-4.589"
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 12,
+        cy: 12,
+        r: 9.75,
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });