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

package/dist/icons/regular/BadgeIcon.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 BadgeIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var BadgeIcon = /*#__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('BadgeIcon');
   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,
@@ -38,20 +41,30 @@ export var BadgeIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M23.25 9.938A13.5 13.5 0 0112 23.25 13.5 13.5 0 01.75 9.938V.75h22.5zM.75 5.25h22.5",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M12.53 8.792l1.249 2.458h2.127a.582.582 0 01.419 1l-1.953 1.922 1.082 2.485a.589.589 0 01-.839.736L12 15.919l-2.615 1.47a.589.589 0 01-.839-.736l1.082-2.485-1.953-1.922a.582.582 0 01.419-1h2.127l1.249-2.454a.594.594 0 011.06 0z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("path", {
+        d: "M23.25 9.938A13.5 13.5 0 0112 23.25 13.5 13.5 0 01.75 9.938V.75h22.5zM.75 5.25h22.5",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12.53 8.792l1.249 2.458h2.127a.582.582 0 01.419 1l-1.953 1.922 1.082 2.485a.589.589 0 01-.839.736L12 15.919l-2.615 1.47a.589.589 0 01-.839-.736l1.082-2.485-1.953-1.922a.582.582 0 01.419-1h2.127l1.249-2.454a.594.594 0 011.06 0z",
+        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/BellIcon.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 BellIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var BellIcon = /*#__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('BellIcon');
   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,
@@ -38,13 +41,23 @@ export var BellIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M10 21.75a2.087 2.087 0 004.005 0M12 3V.75M12 3a7.5 7.5 0 017.5 7.5c0 7.046 1.5 8.25 1.5 8.25H3s1.5-1.916 1.5-8.25A7.5 7.5 0 0112 3z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
+        d: "M10 21.75a2.087 2.087 0 004.005 0M12 3V.75M12 3a7.5 7.5 0 017.5 7.5c0 7.046 1.5 8.25 1.5 8.25H3s1.5-1.916 1.5-8.25A7.5 7.5 0 0112 3z",
+        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/BookClosedBookmarkIcon.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 BookClosedBookmarkIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var BookClosedBookmarkIcon = /*#__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('BookClosedBookmarkIcon');
   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,
@@ -38,20 +41,30 @@ export var BookClosedBookmarkIcon = /*#__PURE__*/React.forwardRef(function (_ref
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M18 2.25h1.5a1.5 1.5 0 011.5 1.5v18a1.5 1.5 0 01-1.5 1.5h-15a1.5 1.5 0 01-1.5-1.5v-18a1.5 1.5 0 011.5-1.5H12m-4.5 0v21",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M18 12.75l-3-3-3 3V2.25a1.5 1.5 0 011.5-1.5h3a1.5 1.5 0 011.5 1.5z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("path", {
+        d: "M18 2.25h1.5a1.5 1.5 0 011.5 1.5v18a1.5 1.5 0 01-1.5 1.5h-15a1.5 1.5 0 01-1.5-1.5v-18a1.5 1.5 0 011.5-1.5H12m-4.5 0v21",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M18 12.75l-3-3-3 3V2.25a1.5 1.5 0 011.5-1.5h3a1.5 1.5 0 011.5 1.5z",
+        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/BookFlipPageIcon.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 BookFlipPageIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var BookFlipPageIcon = /*#__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('BookFlipPageIcon');
   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,
@@ -38,20 +41,30 @@ export var BookFlipPageIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgR
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M18 4.144a31.156 31.156 0 014.732-.394.517.517 0 01.366.144.5.5 0 01.152.356v15.768a.505.505 0 01-.5.5C14.457 20.621 12 23.25 12 23.25V6.482S9.545 3.856 1.268 3.75a.517.517 0 00-.368.144.5.5 0 00-.15.356v15.768a.505.505 0 00.5.5C9.543 20.621 12 23.25 12 23.25",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
-    }), /*#__PURE__*/_jsx("path", {
-      d: "M12 22.757a6.035 6.035 0 011.636-3.448A8.228 8.228 0 0118 16.846V1.243a.481.481 0 00-.228-.4.6.6 0 00-.494-.066 7.8 7.8 0 00-3.642 2.277A6.035 6.035 0 0012 6.5",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("path", {
+        d: "M18 4.144a31.156 31.156 0 014.732-.394.517.517 0 01.366.144.5.5 0 01.152.356v15.768a.505.505 0 01-.5.5C14.457 20.621 12 23.25 12 23.25V6.482S9.545 3.856 1.268 3.75a.517.517 0 00-.368.144.5.5 0 00-.15.356v15.768a.505.505 0 00.5.5C9.543 20.621 12 23.25 12 23.25",
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5
+      }), /*#__PURE__*/_jsx("path", {
+        d: "M12 22.757a6.035 6.035 0 011.636-3.448A8.228 8.228 0 0118 16.846V1.243a.481.481 0 00-.228-.4.6.6 0 00-.494-.066 7.8 7.8 0 00-3.642 2.277A6.035 6.035 0 0012 6.5",
+        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/BriefcaseIcon.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 BriefcaseIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var BriefcaseIcon = /*#__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('BriefcaseIcon');
   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,
@@ -38,25 +41,35 @@ export var BriefcaseIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("rect", {
-      x: 0.75,
-      y: 6,
-      width: 22.5,
-      height: 16.5,
-      rx: 1.5,
-      ry: 1.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: "M5.25 11.25h13.5m-13.5 6h13.5M15.342 2.525A1.5 1.5 0 0013.919 1.5h-3.838a1.5 1.5 0 00-1.423 1.025L7.5 6h9zM3.75 6V4.5M20.25 6V4.5"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("rect", {
+        x: 0.75,
+        y: 6,
+        width: 22.5,
+        height: 16.5,
+        rx: 1.5,
+        ry: 1.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: "M5.25 11.25h13.5m-13.5 6h13.5M15.342 2.525A1.5 1.5 0 0013.919 1.5h-3.838a1.5 1.5 0 00-1.423 1.025L7.5 6h9zM3.75 6V4.5M20.25 6V4.5"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/BrowserPageLayoutIcon.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 BrowserPageLayoutIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var BrowserPageLayoutIcon = /*#__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('BrowserPageLayoutIcon');
   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,
@@ -38,8 +41,18 @@ export var BrowserPageLayoutIcon = /*#__PURE__*/React.forwardRef(function (_ref,
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M3 22.5a2.252 2.252 0 01-2.25-2.25V3.75A2.252 2.252 0 013 1.5h18a2.252 2.252 0 012.25 2.25v16.5A2.252 2.252 0 0121 22.5H3zM21 21a.75.75 0 00.75-.75V15h-12v6H21zm-18.75-.75c0 .414.336.75.75.75h5.25V7.5h-6v12.75zm19.5-6.75v-6h-12v6h12zm0-7.5V3.75A.75.75 0 0021 3H3a.75.75 0 00-.75.75V6h19.5z"
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
+        d: "M3 22.5a2.252 2.252 0 01-2.25-2.25V3.75A2.252 2.252 0 013 1.5h18a2.252 2.252 0 012.25 2.25v16.5A2.252 2.252 0 0121 22.5H3zM21 21a.75.75 0 00.75-.75V15h-12v6H21zm-18.75-.75c0 .414.336.75.75.75h5.25V7.5h-6v12.75zm19.5-6.75v-6h-12v6h12zm0-7.5V3.75A.75.75 0 0021 3H3a.75.75 0 00-.75.75V6h19.5z"
+      })
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/BulbIcon.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 BulbIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var BulbIcon = /*#__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('BulbIcon');
   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,
@@ -38,13 +41,23 @@ export var BulbIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5,
-      d: "M10.5 22.5h3M18 12a6 6 0 10-7.5 5.788V19.5h3v-1.712A5.986 5.986 0 0018 12zm-6-9V1.5m9 9h1.5M1.5 12H3m15.364 5.614l1.061 1.061M4.575 3.825l1.061 1.061m12.728 0l1.061-1.061m-14.85 14.85l1.061-1.061"
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
+        fill: "none",
+        stroke: "#fff",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: 1.5,
+        d: "M10.5 22.5h3M18 12a6 6 0 10-7.5 5.788V19.5h3v-1.712A5.986 5.986 0 0018 12zm-6-9V1.5m9 9h1.5M1.5 12H3m15.364 5.614l1.061 1.061M4.575 3.825l1.061 1.061m12.728 0l1.061-1.061m-14.85 14.85l1.061-1.061"
+      })
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/CalendarIcon.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 CalendarIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var CalendarIcon = /*#__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('CalendarIcon');
   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,
@@ -38,25 +41,35 @@ export var CalendarIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("rect", {
-      x: 0.75,
-      y: 3.75,
-      width: 22.5,
-      height: 19.5,
-      rx: 1.5,
-      ry: 1.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: "M.75 9.75h22.5M6.75 6V.75M17.25 6V.75M5.625 13.5h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375m0 5.25h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375M12 13.5h0m0 0a.375.375 0 10.375.375A.375.375 0 0012 13.5m0 5.25h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375m6.375-5.25h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375m0 5.25h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375"
+    }) : null, /*#__PURE__*/_jsxs("mask", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("rect", {
+        x: 0.75,
+        y: 3.75,
+        width: 22.5,
+        height: 19.5,
+        rx: 1.5,
+        ry: 1.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: "M.75 9.75h22.5M6.75 6V.75M17.25 6V.75M5.625 13.5h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375m0 5.25h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375M12 13.5h0m0 0a.375.375 0 10.375.375A.375.375 0 0012 13.5m0 5.25h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375m6.375-5.25h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375m0 5.25h0m0 0a.375.375 0 10.375.375.375.375 0 00-.375-.375"
+      })]
+    }), /*#__PURE__*/_jsx("g", {
+      mask: "url(#".concat(maskId, ")"),
+      children: /*#__PURE__*/_jsx("rect", {
+        width: "100%",
+        height: "100%",
+        fill: "currentColor"
+      })
     })]
   }));
 });

package/dist/icons/regular/CallIcon.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 CallIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,12 +22,14 @@ export var CallIcon = /*#__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('CallIcon');
   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,
@@ -38,13 +41,23 @@ export var CallIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsx("path", {
-      d: "M15.04 22.39l.012.007a5.533 5.533 0 006.884-.755l.774-.774a1.846 1.846 0 000-2.609L19.449 15a1.846 1.846 0 00-2.609 0h0a1.843 1.843 0 01-2.608 0L9.014 9.781a1.846 1.846 0 010-2.609h0a1.843 1.843 0 000-2.608L5.754 1.3a1.846 1.846 0 00-2.609 0l-.774.774a5.535 5.535 0 00-.756 6.884l.008.012A49.935 49.935 0 0015.04 22.39z",
-      fill: "none",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 1.5
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
+        d: "M15.04 22.39l.012.007a5.533 5.533 0 006.884-.755l.774-.774a1.846 1.846 0 000-2.609L19.449 15a1.846 1.846 0 00-2.609 0h0a1.843 1.843 0 01-2.608 0L9.014 9.781a1.846 1.846 0 010-2.609h0a1.843 1.843 0 000-2.608L5.754 1.3a1.846 1.846 0 00-2.609 0l-.774.774a5.535 5.535 0 00-.756 6.884l.008.012A49.935 49.935 0 0015.04 22.39z",
+        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"
+      })
     })]
   }));
 });