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

package/dist/icons/regular/StackedSquaresIcon.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 StackedSquaresIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var StackedSquaresIcon = /*#__PURE__*/React.forwardRef(function (_ref, sv
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('StackedSquaresIcon');
   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,19 +38,31 @@ export var StackedSquaresIcon = /*#__PURE__*/React.forwardRef(function (_ref, sv
     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: "M133.683 36.167L74.13 5.378a9 9 0 00-8.26 0L6.317 36.167a3.593 3.593 0 000 6.381L65.87 73.354a9 9 0 008.26 0l59.553-30.77a3.593 3.593 0 000-6.382z"
-      }), /*#__PURE__*/_jsx("path", {
-        d: "M29.75 54.688L6.318 66.808a3.593 3.593 0 000 6.382l59.552 30.806a9 9 0 008.26 0l59.553-30.806a3.593 3.593 0 000-6.382L110.25 54.687"
-      }), /*#__PURE__*/_jsx("path", {
-        d: "M29.75 85.313L6.318 97.416a3.593 3.593 0 000 6.381l59.552 30.806a9 9 0 008.26 0l59.553-30.77a3.593 3.593 0 000-6.382l-23.433-12.14"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "stacked-squares-".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'stacked-squares'
+      }), /*#__PURE__*/_jsxs("g", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 8.75,
+        children: [/*#__PURE__*/_jsx("path", {
+          d: "M133.683 36.167L74.13 5.378a9 9 0 00-8.26 0L6.317 36.167a3.593 3.593 0 000 6.381L65.87 73.354a9 9 0 008.26 0l59.553-30.77a3.593 3.593 0 000-6.382z"
+        }), /*#__PURE__*/_jsx("path", {
+          d: "M29.75 54.688L6.318 66.808a3.593 3.593 0 000 6.382l59.552 30.806a9 9 0 008.26 0l59.553-30.806a3.593 3.593 0 000-6.382L110.25 54.687"
+        }), /*#__PURE__*/_jsx("path", {
+          d: "M29.75 85.313L6.318 97.416a3.593 3.593 0 000 6.381l59.552 30.806a9 9 0 008.26 0l59.553-30.77a3.593 3.593 0 000-6.382l-23.433-12.14"
+        })]
       })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#stacked-squares-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/StarCircleIcon.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 StarCircleIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,34 +22,45 @@ export var StarCircleIcon = /*#__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('StarCircleIcon');
   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: 'rating-star-circle'
-    }) : 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: 1.5,
-      children: [/*#__PURE__*/_jsx("path", {
-        d: "M12.593 6.8l1.4 2.95h2.377a.651.651 0 01.469 1.114l-2.187 1.946 1.209 2.778a.658.658 0 01-.938.823L12 14.767l-2.923 1.644a.658.658 0 01-.938-.823l1.209-2.778-2.183-1.946a.651.651 0 01.469-1.114h2.377l1.4-2.95a.665.665 0 011.182 0z"
-      }), /*#__PURE__*/_jsx("path", {
-        d: "M.75 12a11.25 11.25 0 1022.5 0 11.25 11.25 0 10-22.5 0z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "rating-star-circle-".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'rating-star-circle'
+      }), /*#__PURE__*/_jsxs("g", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5,
+        children: [/*#__PURE__*/_jsx("path", {
+          d: "M12.593 6.8l1.4 2.95h2.377a.651.651 0 01.469 1.114l-2.187 1.946 1.209 2.778a.658.658 0 01-.938.823L12 14.767l-2.923 1.644a.658.658 0 01-.938-.823l1.209-2.778-2.183-1.946a.651.651 0 01.469-1.114h2.377l1.4-2.95a.665.665 0 011.182 0z"
+        }), /*#__PURE__*/_jsx("path", {
+          d: "M.75 12a11.25 11.25 0 1022.5 0 11.25 11.25 0 10-22.5 0z"
+        })]
       })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#rating-star-circle-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/StarFilledCircleIcon.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 StarFilledCircleIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var StarFilledCircleIcon = /*#__PURE__*/React.forwardRef(function (_ref,
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('StarFilledCircleIcon');
   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,
@@ -35,11 +38,23 @@ export var StarFilledCircleIcon = /*#__PURE__*/React.forwardRef(function (_ref,
     children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      fillRule: "evenodd",
-      clipRule: "evenodd",
-      d: "M12 24c6.627 0 12-5.373 12-12S18.627 0 12 0 0 5.373 0 12s5.373 12 12 12zm5.503-13.99a.752.752 0 01.297.804.75.75 0 01-.239.381l-2.597 2.153a.25.25 0 00-.078.271l1.09 3.268a.75.75 0 01-1.157.841l-2.671-1.959a.25.25 0 00-.296 0l-2.673 1.96a.75.75 0 01-1.155-.842l1.089-3.266a.25.25 0 00-.077-.271L6.444 11.2a.75.75 0 01.481-1.325H9.97a.25.25 0 00.235-.168l1.09-3.088.002-.008a.75.75 0 011.405 0l1.093 3.096a.25.25 0 00.236.167h3.043c.154 0 .303.048.429.136z",
-      fill: "currentColor"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "star-filled-circle-".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'star-filled-circle'
+      }), /*#__PURE__*/_jsx("path", {
+        fillRule: "evenodd",
+        clipRule: "evenodd",
+        d: "M12 24c6.627 0 12-5.373 12-12S18.627 0 12 0 0 5.373 0 12s5.373 12 12 12zm5.503-13.99a.752.752 0 01.297.804.75.75 0 01-.239.381l-2.597 2.153a.25.25 0 00-.078.271l1.09 3.268a.75.75 0 01-1.157.841l-2.671-1.959a.25.25 0 00-.296 0l-2.673 1.96a.75.75 0 01-1.155-.842l1.089-3.266a.25.25 0 00-.077-.271L6.444 11.2a.75.75 0 01.481-1.325H9.97a.25.25 0 00.235-.168l1.09-3.088.002-.008a.75.75 0 011.405 0l1.093 3.096a.25.25 0 00.236.167h3.043c.154 0 .303.048.429.136z",
+        fill: "#fff"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#star-filled-circle-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/StarFilledIcon.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 StarFilledIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,25 +22,36 @@ export var StarFilledIcon = /*#__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('StarFilledIcon');
   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: 'star-filled-icon'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M23.555 8.729a1.505 1.505 0 00-1.406-.98h-6.087a.5.5 0 01-.472-.334l-2.185-6.193a1.5 1.5 0 00-2.81 0l-.005.016-2.18 6.177a.5.5 0 01-.471.334H1.85A1.5 1.5 0 00.887 10.4l5.184 4.3a.5.5 0 01.155.543l-2.178 6.531a1.5 1.5 0 002.31 1.684l5.346-3.92a.5.5 0 01.591 0l5.344 3.919a1.5 1.5 0 002.312-1.683l-2.178-6.535a.5.5 0 01.155-.543l5.194-4.306a1.5 1.5 0 00.433-1.661z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "star-filled-icon-".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'star-filled-icon'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M23.555 8.729a1.505 1.505 0 00-1.406-.98h-6.087a.5.5 0 01-.472-.334l-2.185-6.193a1.5 1.5 0 00-2.81 0l-.005.016-2.18 6.177a.5.5 0 01-.471.334H1.85A1.5 1.5 0 00.887 10.4l5.184 4.3a.5.5 0 01.155.543l-2.178 6.531a1.5 1.5 0 002.31 1.684l5.346-3.92a.5.5 0 01.591 0l5.344 3.919a1.5 1.5 0 002.312-1.683l-2.178-6.535a.5.5 0 01.155-.543l5.194-4.306a1.5 1.5 0 00.433-1.661z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#star-filled-icon-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/StarIcon.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 StarIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,30 +22,41 @@ export var StarIcon = /*#__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('StarIcon');
   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: '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-".concat(maskId),
+      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-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/StreakIcon.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 StreakIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,30 +22,41 @@ export var StreakIcon = /*#__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('StreakIcon');
   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: 'trends-hot-flame'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M16.846 14.222a4.338 4.338 0 01-4.154 4.5m-.692 4.5c-4.615 0-9-3.358-9-7.5a7.658 7.658 0 014.94-7.287.375.375 0 01.515.382A4.814 4.814 0 0010.1 13.1a.749.749 0 00.992-.021c1.32-1.217 4.557-5.237-1.223-11.676a.375.375 0 01.324-.623C15.621 1.447 21 7.571 21 13.472c0 5-3 9.75-9 9.75z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "trends-hot-flame-".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'trends-hot-flame'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M16.846 14.222a4.338 4.338 0 01-4.154 4.5m-.692 4.5c-4.615 0-9-3.358-9-7.5a7.658 7.658 0 014.94-7.287.375.375 0 01.515.382A4.814 4.814 0 0010.1 13.1a.749.749 0 00.992-.021c1.32-1.217 4.557-5.237-1.223-11.676a.375.375 0 01.324-.623C15.621 1.447 21 7.571 21 13.472c0 5-3 9.75-9 9.75z",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#trends-hot-flame-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/StudyBookIcon.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 StudyBookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,27 +22,38 @@ export var StudyBookIcon = /*#__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('StudyBookIcon');
   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: 'study-book'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M8.173 18.969a.762.762 0 01-.236-.038 20.367 20.367 0 00-5.8-1.022A2.247 2.247 0 010 15.661V2.3A2.252 2.252 0 012.405.051c5.301.277 8.374 1.821 9.626 3.309C13.609 1.591 17.268.313 21.596.057A2.257 2.257 0 0124 2.306v12.6a.75.75 0 01-1.5 0v-12.6l-.002-.061a.751.751 0 00-.746-.693l-.056.002c-2.62.155-5.022.712-6.767 1.568-1.505.738-2.179 1.532-2.179 1.992v3.887a.75.75 0 01-1.5 0V5.114c0-1.08-2.621-3.234-8.935-3.565a.75.75 0 00-.815.749v13.366a.742.742 0 00.7.746c2.103.062 4.195.431 6.208 1.097.19.063.344.196.434.375s.105.382.042.573a.747.747 0 01-.711.514z"
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M9.342 7.298a.74.74 0 01-.255-.045 23.751 23.751 0 00-5.403-1.26.75.75 0 01.166-1.49c1.96.22 3.893.671 5.746 1.34a.747.747 0 01.45.961.749.749 0 01-.704.494zm10.072 2.673a.746.746 0 01-.74-.63.748.748 0 01.621-.86c.351-.057.716-.11 1.086-.158a.752.752 0 01.692 1.2.744.744 0 01-.498.286c-.355.046-.702.097-1.04.152a.731.731 0 01-.121.01zM9.342 11.113a.752.752 0 01-.253-.044 24.317 24.317 0 00-5.406-1.261.75.75 0 01.171-1.49c1.956.224 3.887.675 5.741 1.339.189.068.34.204.425.385a.75.75 0 01-.678 1.071zm0 4.043a.747.747 0 01-.252-.044 24.559 24.559 0 00-5.457-1.261.748.748 0 01-.661-.83.75.75 0 01.829-.661c1.972.223 3.921.673 5.792 1.339.189.067.34.204.426.385s.096.385.029.573a.75.75 0 01-.706.499zM14.9 7.305a.751.751 0 01-.252-1.457 26.037 26.037 0 015.795-1.339.75.75 0 01.67 1.213.738.738 0 01-.501.278 24.55 24.55 0 00-5.461 1.261.741.741 0 01-.251.044zm-4.551 16.696a.753.753 0 01-.6-.3l-.474-.632a2.295 2.295 0 010-2.738 2.298 2.298 0 011.83-.914c.496 0 .969.157 1.366.455l.277.208v-7.705c0-1.447 1.177-2.625 2.625-2.625s2.625 1.177 2.625 2.625v5.141l3.063.68a3.759 3.759 0 012.922 4l-.1 1.121a.747.747 0 01-.748.683.75.75 0 01-.746-.817l.1-1.122a2.256 2.256 0 00-1.753-2.401l-3.651-.811a.745.745 0 01-.587-.732v-5.742c0-.62-.505-1.125-1.125-1.125s-1.125.505-1.125 1.125v9.205a.746.746 0 01-.75.75.753.753 0 01-.45-.15l-1.477-1.108a.775.775 0 00-.468-.156.777.777 0 00-.628.313.788.788 0 000 .939l.474.631a.748.748 0 01-.149 1.05.741.741 0 01-.451.152z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "study-book-".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'study-book'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M8.173 18.969a.762.762 0 01-.236-.038 20.367 20.367 0 00-5.8-1.022A2.247 2.247 0 010 15.661V2.3A2.252 2.252 0 012.405.051c5.301.277 8.374 1.821 9.626 3.309C13.609 1.591 17.268.313 21.596.057A2.257 2.257 0 0124 2.306v12.6a.75.75 0 01-1.5 0v-12.6l-.002-.061a.751.751 0 00-.746-.693l-.056.002c-2.62.155-5.022.712-6.767 1.568-1.505.738-2.179 1.532-2.179 1.992v3.887a.75.75 0 01-1.5 0V5.114c0-1.08-2.621-3.234-8.935-3.565a.75.75 0 00-.815.749v13.366a.742.742 0 00.7.746c2.103.062 4.195.431 6.208 1.097.19.063.344.196.434.375s.105.382.042.573a.747.747 0 01-.711.514z"
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M9.342 7.298a.74.74 0 01-.255-.045 23.751 23.751 0 00-5.403-1.26.75.75 0 01.166-1.49c1.96.22 3.893.671 5.746 1.34a.747.747 0 01.45.961.749.749 0 01-.704.494zm10.072 2.673a.746.746 0 01-.74-.63.748.748 0 01.621-.86c.351-.057.716-.11 1.086-.158a.752.752 0 01.692 1.2.744.744 0 01-.498.286c-.355.046-.702.097-1.04.152a.731.731 0 01-.121.01zM9.342 11.113a.752.752 0 01-.253-.044 24.317 24.317 0 00-5.406-1.261.75.75 0 01.171-1.49c1.956.224 3.887.675 5.741 1.339.189.068.34.204.425.385a.75.75 0 01-.678 1.071zm0 4.043a.747.747 0 01-.252-.044 24.559 24.559 0 00-5.457-1.261.748.748 0 01-.661-.83.75.75 0 01.829-.661c1.972.223 3.921.673 5.792 1.339.189.067.34.204.426.385s.096.385.029.573a.75.75 0 01-.706.499zM14.9 7.305a.751.751 0 01-.252-1.457 26.037 26.037 0 015.795-1.339.75.75 0 01.67 1.213.738.738 0 01-.501.278 24.55 24.55 0 00-5.461 1.261.741.741 0 01-.251.044zm-4.551 16.696a.753.753 0 01-.6-.3l-.474-.632a2.295 2.295 0 010-2.738 2.298 2.298 0 011.83-.914c.496 0 .969.157 1.366.455l.277.208v-7.705c0-1.447 1.177-2.625 2.625-2.625s2.625 1.177 2.625 2.625v5.141l3.063.68a3.759 3.759 0 012.922 4l-.1 1.121a.747.747 0 01-.748.683.75.75 0 01-.746-.817l.1-1.122a2.256 2.256 0 00-1.753-2.401l-3.651-.811a.745.745 0 01-.587-.732v-5.742c0-.62-.505-1.125-1.125-1.125s-1.125.505-1.125 1.125v9.205a.746.746 0 01-.75.75.753.753 0 01-.45-.15l-1.477-1.108a.775.775 0 00-.468-.156.777.777 0 00-.628.313.788.788 0 000 .939l.474.631a.748.748 0 01-.149 1.05.741.741 0 01-.451.152z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#study-book-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/SupportFilledIcon.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 SupportFilledIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,25 +22,36 @@ export var SupportFilledIcon = /*#__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('SupportFilledIcon');
   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: 'question-circle'
-    }) : 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 19a1.5 1.5 0 111.5-1.5A1.5 1.5 0 0112 19zm1.6-6.08a1 1 0 00-.6.917 1 1 0 11-2 0 3 3 0 011.8-2.75A2 2 0 1010 9.255a1 1 0 11-2 0 4 4 0 115.6 3.666z"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "question-circle-filled-".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'question-circle-filled'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12 0a12 12 0 1012 12A12.013 12.013 0 0012 0zm0 19a1.5 1.5 0 111.5-1.5A1.5 1.5 0 0112 19zm1.6-6.08a1 1 0 00-.6.917 1 1 0 11-2 0 3 3 0 011.8-2.75A2 2 0 1010 9.255a1 1 0 11-2 0 4 4 0 115.6 3.666z"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#question-circle-filled-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/SupportIcon.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 SupportIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,38 +22,49 @@ export var SupportIcon = /*#__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('SupportIcon');
   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: 'question-circle'
-    }) : title ? /*#__PURE__*/_jsx("title", {
+    children: [title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M9 9a3 3 0 114 2.829 1.5 1.5 0 00-1 1.415v1.006m0 3a.375.375 0 10.375.375.375.375 0 00-.375-.375h0",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("circle", {
-      cx: 12,
-      cy: 12,
-      r: 11.25,
-      strokeMiterlimit: 10,
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "question-circle-".concat(maskId),
+      children: [/*#__PURE__*/_jsx("title", {
+        children: 'question-circle'
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M9 9a3 3 0 114 2.829 1.5 1.5 0 00-1 1.415v1.006m0 3a.375.375 0 10.375.375.375.375 0 00-.375-.375h0",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        fill: "none",
+        stroke: "#fff",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("circle", {
+        cx: 12,
+        cy: 12,
+        r: 11.25,
+        strokeMiterlimit: 10,
+        fill: "none",
+        stroke: "#fff",
+        strokeWidth: 1.5
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#question-circle-".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });