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

package/dist/icons/regular/MarkerIcon.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 MarkerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MarkerIcon = /*#__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('MarkerIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,23 +35,24 @@ export var MarkerIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'pin-location'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "pin-location-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'pin-location'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round",
         strokeWidth: 1.5,
         d: "M.75 23.25h22.5m-3.75-15c0 4.142-7.5 10.5-7.5 10.5s-7.5-6.358-7.5-10.5a7.5 7.5 0 0115 0z"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#pin-location-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MastercardIcon.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 MastercardIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MastercardIcon = /*#__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('MastercardIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,14 +35,15 @@ export var MastercardIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'mastercard'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
     }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "mastercard-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'mastercard'
-      }), /*#__PURE__*/_jsx("path", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("path", {
         d: "M.504 3.5h23v17h-23z",
         fill: "none",
         stroke: "#fff",
@@ -72,7 +75,7 @@ export var MastercardIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef
         strokeLinejoin: "round"
       })]
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#mastercard-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MediumIcon.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 MediumIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MediumIcon = /*#__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('MediumIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,18 +35,19 @@ export var MediumIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'Medium-new'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "medium-new-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'Medium-new'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         d: "M23 0H1a1 1 0 00-1 1v22a1 1 0 001 1h22a1 1 0 001-1V1a1 1 0 00-1-1zm-2.64 5.85L19 7.08a.38.38 0 00-.14.36v9.48a.38.38 0 00.14.36l1.35 1.33v.27H14v-.27l1.16-1.36c.13-.13.13-.17.13-.36V10l-2.8 7.9-.3 1h-.79c-2.65-5.79-3.49-7.82-4.3-9.21v7l1.64 2v.27H4v-.27l1.6-2v-9L4.36 6.15v-.53h4.77l3.22 7.71L15 6.06a.75.75 0 01.79-.58h4.58z"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#medium-new-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MegaphoneIcon.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 MegaphoneIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MegaphoneIcon = /*#__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('MegaphoneIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
@@ -33,14 +35,15 @@ export var MegaphoneIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'megaphone'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "megaphone-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'megaphone'
-      }), /*#__PURE__*/_jsxs("g", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsxs("g", {
         fill: "none",
         stroke: "#fff",
         strokeWidth: 1.5,
@@ -51,9 +54,9 @@ export var MegaphoneIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
         }), /*#__PURE__*/_jsx("path", {
           d: "M14.64 18A5.606 5.606 0 013.6 16.495a5.734 5.734 0 01.442-2.22M16.8 3.569v15.194"
         })]
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#megaphone-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MenuIcon.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 MenuIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MenuIcon = /*#__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('MenuIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,23 +35,24 @@ export var MenuIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'navigation-menu'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "navigation-menu-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'navigation-menu'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round",
         strokeWidth: 1.5,
         d: "M2.25 18.003h19.5m-19.5-6h19.5m-19.5-6h19.5"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#navigation-menu-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MinimizeIcon.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 MinimizeIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MinimizeIcon = /*#__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('MinimizeIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,23 +35,24 @@ export var MinimizeIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'shrink-2'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "shrink-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'shrink-2'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round",
         strokeWidth: 1.5,
         d: "M23.25.748l-9 9m-4.5 11.25v-6.75H3m11.25-11.25v6.75H21m-11.25 4.5l-9 9"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#shrink-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MonitorBookIcon.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 MonitorBookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MonitorBookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('MonitorBookIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 140 140",
@@ -33,14 +35,15 @@ export var MonitorBookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'monitor-book'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "monitor-book-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'monitor-book'
-      }), /*#__PURE__*/_jsxs("g", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsxs("g", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
@@ -53,9 +56,9 @@ export var MonitorBookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
         }), /*#__PURE__*/_jsx("path", {
           d: "M21.875 39.392l17.5 13.125-17.5 13.125m35-13.125H78.75"
         })]
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#monitor-book-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MultipleActionsViewIcon.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 MultipleActionsViewIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MultipleActionsViewIcon = /*#__PURE__*/React.forwardRef(function (_re
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('MultipleActionsViewIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,14 +35,15 @@ export var MultipleActionsViewIcon = /*#__PURE__*/React.forwardRef(function (_re
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'multiple-actions-view'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
     }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "multiple-actions-view-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'multiple-actions-view'
-      }), /*#__PURE__*/_jsx("path", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("path", {
         d: "M5.999 7.5c-2.068 0-3.75-1.682-3.75-3.75S3.932 0 5.999 0s3.75 1.682 3.75 3.75S8.067 7.5 5.999 7.5zm0-6c-1.241 0-2.25 1.009-2.25 2.25S4.759 6 5.999 6s2.25-1.009 2.25-2.25S7.24 1.5 5.999 1.5z"
       }), /*#__PURE__*/_jsx("path", {
         d: "M3.749 24a.747.747 0 01-.746-.675L2.321 16.5H.749a.75.75 0 01-.75-.75V13.5c0-1.579.609-3.069 1.714-4.197a5.963 5.963 0 014.225-1.802h.071A5.96 5.96 0 0110.2 9.215a.747.747 0 01-.525 1.285.747.747 0 01-.525-.214 4.493 4.493 0 00-3.164-1.285h-.034a4.475 4.475 0 00-3.167 1.351A4.478 4.478 0 001.499 13.5V15h1.5c.387 0 .708.29.746.675l.683 6.825h3.143l.218-2.175a.747.747 0 01.826-.672.746.746 0 01.668.821l-.286 2.85a.75.75 0 01-.748.676h-4.5z"
@@ -50,7 +53,7 @@ export var MultipleActionsViewIcon = /*#__PURE__*/React.forwardRef(function (_re
         d: "M20.4 9.75a.751.751 0 01-.649-.375 3.723 3.723 0 00-2.278-1.747 3.744 3.744 0 00-2.845.376 3.783 3.783 0 00-.948.779.752.752 0 01-1.13-.988 5.258 5.258 0 013.945-1.797c.458 0 .917.061 1.365.18a5.214 5.214 0 013.188 2.445.751.751 0 01-.648 1.127z"
       })]
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#multiple-actions-view-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/MultipleUsersIcon.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 MultipleUsersIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var MultipleUsersIcon = /*#__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('MultipleUsersIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 140 140",
@@ -33,23 +35,24 @@ export var MultipleUsersIcon = /*#__PURE__*/React.forwardRef(function (_ref, svg
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'multiple-users'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "multiple-users-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'multiple-users'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         d: "M13.125 35a13.125 13.125 0 1026.25 0 13.125 13.125 0 10-26.25 0zM26.25 56.875A21.875 21.875 0 004.375 78.75v13.125h8.75l4.375 35H35M100.625 35a13.125 13.125 0 1026.25 0 13.125 13.125 0 10-26.25 0zm13.125 21.875a21.875 21.875 0 0121.875 21.875v13.125h-8.75l-4.375 35H105m-52.5-105a17.5 17.5 0 1035 0 17.5 17.5 0 10-35 0zm48.125 56.875a30.625 30.625 0 00-61.25 0v13.125H52.5l4.375 43.75h26.25l4.375-43.75h13.125z",
         strokeWidth: 8.75,
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#multiple-users-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/NarrativeIcon.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 NarrativeIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var NarrativeIcon = /*#__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('NarrativeIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,23 +35,24 @@ export var NarrativeIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'book-open-2'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "book-open-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'book-open-2'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         d: "M11.458 21.269a1.6 1.6 0 001.085 0 13.66 13.66 0 018.7-.448 1.607 1.607 0 002.006-1.559V4.928a1.607 1.607 0 00-1.12-1.528 13.878 13.878 0 00-9.586.2 1.61 1.61 0 01-1.085 0 13.881 13.881 0 00-9.587-.2A1.607 1.607 0 00.75 4.928v14.334a1.607 1.607 0 002.006 1.559 13.663 13.663 0 018.702.448zM12 3.682v17.682",
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round",
         strokeWidth: 1.5
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#book-open-2-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/NetworkUserIcon.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 NetworkUserIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var NetworkUserIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? size : _ref$width,
     props = _objectWithoutProperties(_ref, ["title", "titleId", "size", "height", "width"]);
+  var maskId = useIconId('NetworkUserIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     viewBox: "0 0 140 140",
     xmlns: "http://www.w3.org/2000/svg",
@@ -33,14 +35,15 @@ export var NetworkUserIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'network-user'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "network-user-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'network-user'
-      }), /*#__PURE__*/_jsxs("g", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsxs("g", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
@@ -51,9 +54,9 @@ export var NetworkUserIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRe
         }), /*#__PURE__*/_jsx("path", {
           d: "M89.688 76.568a15.313 15.313 0 1030.624 0 15.313 15.313 0 10-30.624 0zM105 96.25a30.625 30.625 0 00-30.625 30.625v8.75h61.25v-8.75A30.62 30.62 0 00105 96.25z"
         })]
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#network-user-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/NotebookIcon.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 NotebookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var NotebookIcon = /*#__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('NotebookIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,14 +35,15 @@ export var NotebookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'notes-book'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
     }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "notes-book-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'notes-book'
-      }), /*#__PURE__*/_jsx("path", {
+      id: "".concat(maskId),
+      children: [/*#__PURE__*/_jsx("path", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
@@ -80,7 +83,7 @@ export var NotebookIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
         strokeWidth: 1.5
       })]
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#notes-book-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",

package/dist/icons/regular/ObjectiveIcon.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 ObjectiveIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef) {
@@ -21,6 +22,7 @@ export var ObjectiveIcon = /*#__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('ObjectiveIcon');
   return /*#__PURE__*/_jsxs(Svg, _objectSpread(_objectSpread({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
@@ -33,23 +35,24 @@ export var ObjectiveIcon = /*#__PURE__*/React.forwardRef(function (_ref, svgRef)
     ref: svgRef,
     "aria-labelledby": titleId
   }, props), {}, {
-    children: [title ? /*#__PURE__*/_jsx("title", {
+    children: [title === undefined ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: 'target-center'
+    }) : title ? /*#__PURE__*/_jsx("title", {
       id: titleId,
       children: title
-    }) : null, /*#__PURE__*/_jsxs("mask", {
-      id: "target-center-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default'),
-      children: [/*#__PURE__*/_jsx("title", {
-        children: 'target-center'
-      }), /*#__PURE__*/_jsx("path", {
+    }) : null, /*#__PURE__*/_jsx("mask", {
+      id: "".concat(maskId),
+      children: /*#__PURE__*/_jsx("path", {
         fill: "none",
         stroke: "#fff",
         strokeLinecap: "round",
         strokeLinejoin: "round",
         strokeWidth: 1.5,
         d: "M11.016 11.859l4.167-4.167m0 0l.568-3.75L18.999.75l.502 2.624 2.624.502-3.192 3.248-3.75.568zm5.872 1.821A9.75 9.75 0 1112.614 2.3m4.108 8.437a5.251 5.251 0 11-5.1-3.987m-5.106 13.5l-.75 3m11.25-3l.75 3"
-      })]
+      })
     }), /*#__PURE__*/_jsx("g", {
-      mask: "url(#target-center-".concat(titleId !== null && titleId !== void 0 ? titleId : 'default', ")"),
+      mask: "url(#".concat(maskId, ")"),
       children: /*#__PURE__*/_jsx("rect", {
         width: "100%",
         height: "100%",